使用方法

1.加载loader
css的loader会将css文件内容放在style标签中
style的loader会将生成style标签放在html中，有几个css文件就有几个style标签

  1. $ npm install --save-dev style-loader
  2. $ npm install --save-dev css-loader

2.指示webpack对css文件使用css-loader以及style-loader，如下
意思是，读取到.css的文件类型，就使用对应的loader处理文件

  1. module.exports = {
  2.   module: {
  3.     rules: [
  4.       { test: /\.css$/i, 
  5.         use: ['style-loader','css-loader'] }//注意顺序，不可以错
  6.     ]
  7.   }
  8. };

loader的其他使用方式

在你的应用程序中，有三种使用 loader 的方式：

  • 配置（推荐）：在 webpack.config.js 文件中指定 loader。
  • 内联：在每个 import 语句中显式指定 loader。
  • CLI：在 shell 命令中指定它们。