webpack

构建与部署

4.1 webpack 简介

4.1.1 一切皆模块

模块化带来的优点：
1.解决了命名冲突的问题，变量均存在于模块命名空间之中，避免了全局冲突
2.解决了文件依赖问题
3.使得模块高内聚，具有更好的复用性

4.1.2 Webpack的使用

1. 输入输出

• https://www.cnblogs.com/zhennann/p/12064708.html

2. 预处理器
   webpack只能处理js相关的文件，于是需要响应的loader来处理css文件，如css-loader,style-loader
3. 代码分片
   为了使用延迟加载，优化加载速度，使用渐进式获取，我们需要进行代码分片，插件 如SplitChunksPlugin 和HtmlWebpackPluguin

4.1.3 Webpack 环境配置

1. 开发环境

• 要注意webpack,webpack-cli,webpack-dev-server 的配套问题
  https://www.jianshu.com/p/649c1410f50b

2. 生产环境

• 独立配置生产配置，增加hash值，以便重新打包后浏览器能够请求新资源

3. 资源压缩

4.1.4 Webpack进阶

1.并行构建HappyPack
2.动态链接库 DllPlugin

4.2 Nginx简介

4.2.1