webpack 系列

webpack作为最流行的前端模块打包工具，是前端工程化的利器，我们有必要认真了解一下。为此特意购买和搜集了部分webpack学习视屏。其中DellLee老师的webpack学习视频，思路最清晰，帮助最大，我认真记录了笔记。视频链接如下：https://coding.imooc.com/class/316.html
如果大家有兴趣，建议购买视频学习。然后结合笔记看，会更有收获。
主要分为如下几部分：
2-1 webpack究竟是什么
2-2 什么是模块打包工具
2-3 webpack的正确安装方式
2-4 使用webpack的配置文件
2-5 浅析webpack打包内容
3-1 Loader是什么
3-2 使用loader打包静态资源（图片）
3-3 使用loader打包静态资源（样式篇上）
3-4 使用loader打包静态资源（样式篇下）
3-5 使用plugins让打包更便捷
3-6 Entry 与 Output的基础配置
3-7 sourceMap的配置
3-8 使用 WebpackdevServer 提升开发效率
3-9-10 Hot Module Replacement 热模块更新
3-11-12 使用 babel 处理 es6 语法
3-13 webpack 实现对 react 框架代码的打包
4-1 Tree Shaking 概念详解
4-2 Development 和 Production 模式的区分打包
4-3~8 code-splitting，懒加载，预拉取，预加载
4-8 打包分析
4-9 css 文件的代码分割
4-10 webpack 与浏览器缓存（caching）
4-11 shimming 的作用
4-12 环境变量的使用
5-1 library 的打包

参考

看看webpack都打出了些什么
初识webpack——webpack四个基础概念
webpack的commonchunkplugin深度解析以及chunk和module内部结构
webpack4.0各个击破（4）—— Javascript & splitChunk
https://www.kancloud.cn/xiaoyulive/webpack/530026
https://github.com/ruanyf/webpack-demos#demo01-entry-file-source
https://webpack.js.org/concepts/
https://zhuanlan.zhihu.com/p/98677441