3

我正在研究 angular2 "2.0.0-rc.1" 但是 zoneJS 给出了以下错误

Error: Uncaught (in promise): Expected 'styles' to be an array of strings.
    at resolvePromise (zone.js:538)
    at zone.js:515
    at ZoneDelegate.invoke (zone.js:323)
    at Object.NgZoneImpl.inner.inner.fork.onInvoke (eval at <anonymous> (vendor.js:335), <anonymous>:45:41)
    at ZoneDelegate.invoke (zone.js:322)
    at Zone.run (zone.js:216)
    at zone.js:571
    at ZoneDelegate.invokeTask (zone.js:356)
    at Object.NgZoneImpl.inner.inner.fork.onInvokeTask (eval at <anonymous> (vendor.js:335), <anonymous>:36:41)
    at ZoneDelegate.invokeTask (zone.js:355)

我的代码如下

let styles   = require('./dashboard.css');
let template = require('./dashboard.html');
declare var zingchart:any;

@Component({
  selector: 'dashboard',
  directives: [ RouterLink, CORE_DIRECTIVES, FORM_DIRECTIVES ],
  template: template,
  styles: [ styles ]
})
4

4 回答 4

5

试试这个： let styles = String(require('./dashboard.css'));

它对我有用。由于样式需要 string[]，因此将样式解析为 String()。

于 2016-06-10T14:53:09.720 回答
4

我认为您对styles组件中的属性进行了错误的配置。这应该是这样的：

@Component({
  (...)
  styles: [`
    .card {
      height: 70px;
      width: 100px;
    }
  `]
})

有关详细信息，请参阅此链接：

编辑

如果要包含 CSS 文件，请使用以下命令：

@Component({
  (...)
  styleUrls: ['css/style.css']
})
于 2016-05-12T15:10:51.317 回答
2

错误很明显。定义组件时，styles属性应该是数组而不是字符串。

请参阅文档：https ://angular.io/docs/ts/latest/guide/component-styles.html

编辑：如果您想使用 .css 文件，您应该使用该styleUrls属性并指向您的文件。

于 2016-05-12T15:11:10.767 回答
2

当您没有为您的 css 文件定义加载器时，您最终会遇到此错误。
检查你是否在 webpack-configuration 中设置了一个模块加载器，如下所示：

loaders: [
  {
    test: /\.css$/,
    loader: 'raw'
  }
  // ...
]

如果没有 css 文件的加载器，Webpack 将不会选择文件，并且会引发此错误。
如果尚未包含在您的依赖项中，您需要将 raw-loader 添加到您的开发依赖项中，使用npm install --save-dev raw-loader. 如果您使用静态 css 文件并且不需要任何处理当然可以使用styleUrls。
要使用 sass，您需要使用这种方式来加载样式，并且可以raw!sass使用/\.scss$/.

于 2016-05-19T21:55:30.263 回答