🍓一、构建工具
webpack是用来干什么？
- 转换ES6语法
- 转化jsx
- CSS前缀补全
- 压缩混淆
- 图片压缩
🍉 二、配置文件
webpack.config.js ， 也可以通过webpack --config来指定配置文件
🍐三、核心概念
-
Entry:程序入口文件，可以有多个入口文件，单个入口文件时，为字符串，多个入口文件时，为对象.
-
Output:程序输出文件，如果有多个入口文件，输出文件需要用占位符指定。
-
Loaders:本身是一个函数，用来转化
-
Plugins：插件用于bundle文件的优化，资源管理和环境变量注入，作用于整个构建过程(任何loaders没法完成的， 可以通过plugins完成)
-
mode：指定当前构建环境：production、development、none 设置mode可以使用webpack内置的函数，默认是为production(会开启很多插件，webpack会默认帮你去做很多事情).
🍑四、解析
- 解析es6： 使用babel-loader babel的配置文件是： .babelrc
- 解析react：使用babel-react
- 解析css：使用babel-style，babel-css
- 解析less：使用babel-style，babel-css，babel-less
