3. loader 转换

webpack 自带 JavaScript 和 JSON 文件的打包构建能力，无需格外配置，对于其他类型的文件如css等，则需要安装loader处理；

loader 让 webpack 能够去处理其他类型的文件，并将它们转换为有效模块，以供应用程序使用，以及被添加到依赖图中。

modudle.export = {
  module: {     // loader 的配置通过  module 模块配置
      rules: [
      {
        // 匹配的样式文件
        test: /\.css$/,
        use: [
          // 使用的预加载器
          // 都需要安装   npm i style-loader css-loader -D  (npm i css-loader@3.4.2  style-loader@1.1.3 -D)
          // 解析执行顺序是由 右到左 （下到上）
          'style-loader', // 创建 style 标签 ， 将 js 中的样式资源 插入进行 添加到head 中生效
          'css-loader', // 将 css 文件变成 commonjs 模块 加载 js 中， 里面内容是样式 字符串
        ]
      }
    ]
  }
}