我正在使用 Angular2 beta.15 和 webpack 1.12.14。
我有一个 .css 和一个 .scss 文件app.component.ts
作为这样的全局模式。
@Component({
selector: 'my-app',
templateUrl: 'app/app.component.html',
styles: [
require('../stylesheets/css/main.min.css'),
require('../sass/example.scss')
],
encapsulation: ViewEncapsulation.None,
})
而且,在.css
文件内部,一些字体被导入如下,
@font-face {
font-family: 'Helvetica Neue';
src: url(fonts/light/helvetica-neue-light.eot) format("eot"),
url(fonts/light/helvetica-neue-light.woff2) format("woff2"),
url(fonts/light/helvetica-neue-light.woff) format("woff"),
url(fonts/light/helvetica-neue-light.ttf) format("truetype");
font-weight: 300;
font-style: normal
}
在webpack.config.js
中,我有、 和字体的加载器.css
,如下所示.scss
{
test: /\.scss$/,
exclude: /node_modules/,
loaders: ['raw-loader', 'sass-loader'] // sass-loader not scss-loader
},
{
test: /.(png|woff(2)?|eot|ttf|svg)(\?[a-z0-9=\.]+)?$/,
loader: 'url-loader'
},
{
test: /\.css$/,
loaders: ['style', 'css']
},
当我运行webpack -display-error-details
时,根本没有错误,但是当我启动服务器运行我的应用程序时,出现如下错误
EXCEPTION: Error during instantiation of Token Promise<ComponentRef>!.
ORIGINAL EXCEPTION: Expected 'styles' to be an array of string
如果我将 css 加载器更改为
{
test: /\.css$/,
loader: 'url-loader' //or use 'raw-loader'
},
这些异常消失了,应用程序启动了,但是我在浏览器的控制台中收到了这些字体的一些 404 请求错误,它们根本没有加载。那么,你能给我一些指点吗?我怀疑我的加载程序设置有问题。