webpack 的chunkhash,contenthash 以及 hash 的区别

chunkhash:

根据不同的入口文件(entry.js)来进行依赖文件解析,构建对应的chunk ,生成对应的hash值。

性能优化:在生产环境过程中,将第三方库以及公共文件和入口文件分开打包,使用chunkhash的方式生成hash值时,只要不改变公共库的代码,

在打包构建的过程中,就不会重复打包,可以提升构建速度,充分利用缓存。

contenthash:

上述可以将项目的公共依赖,以及入口文件所包含的依赖分开打包。分别生成不同的chunkhash值。

chunkhash缺点: 当入口文件所包含的依赖关系中,只要有其中某一个文件发生变动,其他文件没有发生变动,在打包构建的过程中,每次生成的chunkhash值是不一样的。

会造成重复构建 浪费性能和构建速度。

使用contenthash时,会精确到某一个具体的文件,当文件的内容没有发生改变时,则不会重新构建,会充分利用缓存。同时也能够提升打包构建的速度和效果。

hash:

hash是跟整个项目的构建相关,只要项目里有文件更改,整个项目构建的hash值都会更改,并且全部文件都共用相同的hash值。

在生产打包的构建环境中不建议使用。

 

posted @ 2022-02-20 20:32  TangTaue  阅读(98)  评论(0编辑  收藏  举报