因为更新项目到线上后可能存在缓存的问题,用户访问的还是更新前的代码,所以需要给打包生成的文件添加 hash 后缀来避免缓存的问题。
1.webpack
output: {
path: __dirname + '/build',
filename: 'bundle-[hash].js'
}
2.umi
在 config.js 中设置
export default defineConfig({
// 添加 hash 后缀
hash: true,
// 拆分打包生成的文件,否则只生成一个 umi.js
dynamicImport: {
loading: '@/components/loading',
},
})
或者在根目录添加一个 .umirc.js 文件
export default {
hash: true,
dynamicImport: {
loading: '@/components/loading',
},
}
3.react-app-rewired
默认就有 hash 后缀
react-app-rewired 可以在不 eject 也不创建额外 react-scripts 的情况下修改 create-react-app 内置的 webpack 配置