webpack之文件指纹

原文链接 https://blog.csdn.net/weixin_43675447/article/details/120235539 . 更清楚

原文链接： https://blog.csdn.net/liuhua_2323/article/details/103322392

什么是文件指纹

文件指带纳纹是文件打包后输出的文件名的后缀，通常用来做一些文件的版本管理

如何生成

Hash：和整个项目的构建相关，只要项目文件有修改，整个项目构建的hash值就会更改

Chunkhash：和webpack打包的chunk有关，不同的entyr会生成不同的Chunkhash值（一个页面的值改变了并不会影响另一个页面，js文件一般采用此方法）

Contenthash：根据文件内容来定义hash，文件内容不变，则contenthash不变（css文件一般采用此乱竖方法）

下面我们来看一个例子，以图片的文件指纹为例

1.安装依赖

2.在src下新建index.js，文件目录如下

[图片上传中...(-b61771-1635577926644-0)]

3.下面我们就来配置webpack

4.npm run build运行打包，npm run build是我配置的命令

5.打包结果如下图：

注意哗行大：文件指纹没法和热更新一起使用

css文件指纹简介：

css

chunkhash策略是和chunk相关，因此需要在配置文件配置多拍坦入口

css配置

个人喜欢把js文件配置成contenthash,把css文件配置成chunkhash。这样能保证更携闭改js文件的时候，都袭隐桐会改变，如果只修改css,让它不影响js文件

---