jeddygong / frontend-document

前端每日一练,大厂面试题目,涵盖前端所有知识点,每天进步一点点。HTML/CSS/Javascript/Nodejs/Typescript/ECMAScript/Vue/React/Webpack/小程序/网络/设计模式/数据结构/算法/安全/工程化/性能优化
https://jeddygong.github.io/frontend-document
MIT License
10 stars 4 forks source link

[webpack] [2021-02-13 更新] Webpack打包时Hash码是怎么生成的?随机值存在一样的情况,如何避免? #23

Open jeddygong opened 3 years ago

jeddygong commented 3 years ago

1、Hash

webpack生态中存在多种计算hash 的方式:

Hash 代表每次webpack编译中生成的hash值,所有使用这种方式的文件hash都相同。每次构建都会使webpack计算新的hash。

chunkhash 基于入口文件(entry) 及其关联的chunk生成,某个文件的改动只会影响与它有关联的chunk的hash值,不会影响其他文件。

conenthash 根据文件内容创建。当文件内容发生变化时,contenthash发生变化。

2、避免相同随机值

webpack在计算hash后分割chunk。产生相同随机值可能是因为这些文件属于同一个chunk,可以将某一个文件提 到独立的chunk (如放入entry)