CSS中没有包含Angpack 2的Webpack包

Question

我正在使用Angular 2并尝试包含在组件中引用的CSS：

@Component({
  selector: 'app',
  encapsulation: ViewEncapsulation.None,
  styleUrls: [
    './app.component.css'
  ],

我在webpack配置中包含以下行：

   {
        test:  /\.css$/,
        loader: 'to-string-loader!css-loader'
   }

但是，css不适用于组件。

Answer 1

您必须从基础根文件夹中引用路径..

例如以下是我的文件夹结构..

然后我的代码看起来像

@Component({
  selector: 'my-app',
   templateUrl: 'src/app/sub.component.html',
 styleUrls: ['src/app/app.component.css']

})

export class AppComponent {

}

Answer 2

你需要使用＆＃39; style-loader＆＃39;这将把你的css文件放在index.html页面的样式标记中。

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

＆＃39; CSS-装载机＆＃39;处理你的css文件然后＆＃39; style-loader＆＃39;把它们放在页面的样式标签中。