loader配置处理css样式表

如果要处理非 JS 类型的文件，我们需要手动安装一些合适第三方 loader 加载器

1. 如果需要打包处理 css 文件，需要安装npm i style-loader css-loader -D
2. 打开 webpack.config.js 这个配置文件，在里面新增一个配置节点，叫做 module，它是一个对象；在这个 module 对象身上，有个rules属性，这个rules属性是个数组；这个数组中，存放了所有第三方文件的匹配和处理规则。

module.exports = {
  module: {
    rules: [
      {	 test: /\.css$/, use:[ 'style-loader','css-loader' ，‘less-loader'] },
    ]
  }
  }

注：在调用 loader 的时候，是从后往前调用，当最后一个 loader 调用完毕，会把处理结果直接交给 webpack 进行打包合并，最终输出到bundle.js中去

使用 Loader

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

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