这是我参与「第四届青训营 」笔记创作活动的的第12天，今天是关于《Webpack知识体系》的学习
为什么要学习webpack?
- 理解前端工程化 概念 工具 目标
- 一个团队总要有几个人熟悉
- 高阶前端必经之路
什么是webpack?
本质上是前端资源编译 打包的工具
使用webpack
- 入口处理
- 从‘entry’文件开始，启动编译流程
- 依赖解析
- 从‘entry’文件开始，根据'require' or 'import' 等语句找到依赖资源
- 资源解析
- 根据'module'配置，调用资源转移器，将png css 等非标准JS资源转译成JS内容
- 资源合并打包
- 将转译后的资源内容合并打包为可直接在浏览器运行的JS文件
模块化 一致性
- 多个文件资源合并成一个，减少http请求数
- 支持模块化开发
- 支持高级Js特性
- 支持Typescript CoffeeScript方言
- 统一图片，css 字体 等其它资源的处理模型
- ETC
配置分类
流程类：作用于流程中某个or若干个环节，直接影响打包效果的配置项
工具类：主流程之外，提供更多工程化能力的配置项
配置总览
树摇
Dead Code 代码没有被用到 不可到达 代码的执行结果不会被用到 代码只读不写
Tree-Shaking 模块导出了，但未被其它模块使用
Loader
webpack只认识js
为了处理非标准JS资源，设计出资源翻译模块--loader 用于将资源翻译为标准JS
