webpack学习资料

Loaders

  module: {
   
    rules: [
      {
   
        test: /\.txt$/,
        use: "raw-loader"
      }
    ]
  }

test:匹配规则
user:用的loader名字

plugins
作用于bundle文件的优化，资源管理和环境变量注入，作用于整个构建过程
plugins:[],放入插件

mode
用来指定当前的构建环境：production，development，none 默认production

解析es6
npm i @babel/core @babel/preset-env babel-loader -D
创建.babelrc

{
   
  "presets": ["@babel/preset-env", "@babel/preset-react"]//所有babel
}

webpack

module: {
   
    rules: [
      {
   
        test: /.js$/,//所有js文件
        use: "babel-loader"
      }
    ]
  }

解析css
css-loader:加载.css文件转化成commonjs对象
style-loader:将样式通过