摘要：
代码分割和动态import 意义 对于大的Web应用来讲，将所有的代码都放在一个文件中显然是不够有效的，特别是当你的某些代码块是在某些特殊的时候才会被用到。webpack有一个功能就是将你的代码分割成chunks（语块），当代码运行到需要它们的时候再加载。 适用的场景： 抽离相同的代码到一个共享块 阅读全文
摘要：
| # 文件打包 | | | | ## 文件指纹 | | | | > Hash: 和整个项目的构建相关，只要项目文件有修改，整个项目构建的hash值就会更改 | | > | | > Chunkhash：和webpack打包的chunk有关，不同的entry会生成不同的chunhash值 | | > 阅读全文
摘要：
常见配置 自动添加前缀 效果 代码： display:flex; 打包后的效果： display:-webkit-box; display:-webkit-flex; display:-ms-flexbox; display:flex; 相关插件 使用插件postcss-loader autopre 阅读全文
摘要：
多页面打包 动态获取entry和设置html-webpack-plugin数量 利用glob库获取文件目录 修改文件路径 一个页面在src下单独创建一个页面文件夹，然后里面放index.js和index.html src index index.js index.html shop index.js 阅读全文
摘要：
Source map 使用source map 作用： 通过Source map定位到源代码 科普文章：http://www.ruanyifeng.com/blog/2013/01/javascript_source_map.html 开发环境开启，线上环境关闭 线上排除问题的时候可以将Source 阅读全文
摘要：
提取页面公共资源 基础库分离 思路：将react、react-dom基础包通过cdn引入，不打入最终代码中 方法：使用html-webpack-externals-plugin 使用： const HtmlWebpackExternalsPlugin = require("html-webpack- 阅读全文
摘要：
摇树优化(tree shaking) 概念 一个模块可能有多个方法，只要其中的某个方法使用到了，则整个文件都会被打包到目标文件中去，tree shaking就是只把用到的方法打入目标文件，没有用到的部分在uglify(文件压缩)阶段抹除掉 使用 webpack默认支持，在.babelrc里设置mou 阅读全文
摘要：
发布组件 指令集合 切换到淘宝镜像 npm config set registry https://registry.npm.taobao.org 切换到npm镜像 npm config set registry https://registry.npmjs.org/ 查看镜像地址 npm conf 阅读全文