webpack

webpack是一个模块的打包器。未来大概可能会有一些更好的ide帮助我们去做这些事情以加速开发效率，但是当前可能还需要学习webpack.有教程叫 10天搞定webpack4，如果你在webpack上吃了苦头，大概也正常吧。

https://www.cnblogs.com/ellen-mylife/p/12408879.html

很多插件，功能众多，我们可以去 https://www.npmjs.com/package/mini-css-extract-plugin 去看各种插件的用法。
作为复习巩固，可以看简书 https://www.jianshu.com/p/1d76ce13dd0f 系列教程。
ps

vscode的code runner插件很好用，可以运行单个js文件。
vscode alt + shift +鼠标 ： 多行选中

d:
cd AAAVue
mkdir wbtest
cd wbtest
npm init
cnpm i webpack webpack-cli -d
npx webpack (这个命令可以打包src下的文件)

cnpm i webpack-dev-server -d

npx webpack-dev-server 

cnpm i html-webpack-plugin -d                  //html打包器

cnpm install css-loader style-loader -d       //css打包器
cnpm i less less-laoder -d                      //将less文件转化为css 

cnpm i mini-css-extract-plugin -d        //抽离css ，单独形成一个文件

cnpm i postcss-loader autoprefixer -d    //自动添加css前缀的兼容不同浏览器的  需要添加一个单独的配置文件postcss.config.js

cnpm i optimize-css-assets-webpack-plugin -d   //一个压缩css文件的插件
cnpm i uglifyjs-webpack-plugin -d   //一个js压缩插件  但是在Babel配置之前，这个插件遇到js代码，会报错的

暂时先到这里，前端的水很深啊，一个plugin一个plugin的去学习，挺费时间。不提高级用法富文本编辑器，代码合成器等。。。