webpack系列学习

```js //核心代码 const path = require('path') const HtmlWebpackplugin = require('html-webpack-plugin') m

手写一个loader 手写一个plugin bundler源码编写```js class CopyRightWebpackPlugin { // options接收一些参数 construct

前端为何要进行打包构建？ 代码方面 体积更小（Tree-shaking，压缩，合并），加载更快 编译高级语言或语法（Ts，ES6，Scss） 兼容性和错误检查（Polyfill,postcss,esl

环境搭建和基本配置 环境搭建 babel-polyfill core-js和regenerator的集合 babel-runtime

构建速度 优化打包速度 babel-loader IgnorePlugin noParse happyPack parallelUglifyPlugin Dllplugin 自动刷新 热更新 产出代码

性能优化： 在生产环境配置文件下，路径写上contentHash值，这样在下一次打包的时候，会进行哈希值比对，判断是否命中缓存 url-loader：会把在阈值内的文件打包生成dataURL的形式，减

```js //webpack.common.js const path = require('path') const HtmlWebpackPlugin = require('html-webpa