webpack

安装

• nvm： curl -o- 地址
• nodejs： nvm install 版本
• webpack： npm webpack webpack-cli

配置

• 默认配置文件为 webpack.config.js
• 默认配置项有 entry output mode plugins module
• entry：打包的入口配置，单入口则配置为字符串，多入口配置为对象
• output：打包的出口配置，单入口则配置filenam为固定名称，多入口则配置为[name].js来占位
• loaders：webpack原生只支持js和json文件
  • loaders本身是一个函数，接收一个源文件作为参数，输出转换的结果并将其添加到依赖图中
  • babel-loader，es语法转换
  • 配置在module对象的rules数组中
  • 以对象形式存在，test属性执行匹配规则，use属性指定loader
• plugins：对bundle文件进行优化，资源管理，环境变量注入
  • 作用于构建的整个过程中，可以在任何阶段执行
  • 比如自动清除dist目录等
• mode：指定当前的构建环境
  • production，development，none
  • production则会将process.env.NODE_ENV的值置为development
  • 同时开启对应插件NameModulesPlugin和NameChunksPlugin