Webpack简述
一、为什么要构建工具
人类喜欢书写的代码以及开发方式计算机不喜欢，构建工具的作用就是让人类舒舒服服写自己喜欢的代码，然后一打包生成计算机喜欢的代码
第一个webpack自身仅仅是将我们引入的模块打包成一个文件（编译import），至于es6，ts等等的编译是引入的插件和loader做的
二、webpack的基础配置
通过js引入关系建立树，然后最终打包成一个js
webpack本地的版本和项目的版本不一样
直接输入指令，npm run dev调用会使用本地的webpack进行打包
1.打包配置命名
默认以根目录下的webpack.config.js作为入口进行打包，如果想指定文件作为入口
要用commonjs（require）的语法规范写，不能用es6（import export default）
2.mode的三个取值
-
none：直接打包，不做处理
-
生产模式(production)：压缩和简化代码
-
开发模式(development)：不会压缩和简化代码
3.基本格式
loader
三、webpack处理js
1.babel-loader的配置
npm install babel-loader @babel/corebabel-loader作为接口安装真正编译的包@babel/core
loader定义对某种类型的处理方案
2.options配置
也可以将presets配置放在.babelrc的文件中以json格式书写
3.eslint的工作
在根目录下新建一个eslintrc.js文件，用于写eslint的插件配置