概念
webpack是前端资源打包工具。流程:从入口开始,构造依赖图,将项目中所需要的每一个模块合并成一个或者多个bundles,每个bundle都是静态资源,用于展示内容。
入口(entry)
入口指的是webpack会把哪个模块作为构建依赖图的开始,进入入口文件后,webpack会寻找哪些文件(模块)是跟入口文件直接或者间接依赖的。
输出(output)
该配置决定了webpack在哪个文件夹、以什么文件名去输出它创建的bundles。
loader
webpack只能识别js跟json,所以想要让它认识别的文件,就需要loader作为翻译官。
plugin
打包优化,注入环境变量,资源管理等功能。plugin本质是一个具有apply方法的对象, apply方法会被compiler调用
模块解析
webpack可以解析绝对路径、相对路径、模块路径。
模块热更新(HMR)
模块热更新指的是在应用程序运行的过程中,增删改模块而不重新加载整个页面。
热更新步骤
应用程序要求HMR runtime检查更新
HMR异步下载更新,然后通知应用程序
应用程序要求HMR runtime更新
HMR同步更新