知識
不管是網站，軟件還是小程序，都要直接或間接能為您產生價值，我們在追求其視覺表現的同時，更側重于功能的便捷，營銷的便利，運營的高效，讓網站成為營銷工具，讓軟件能切實提升企業(yè)內部管理水平和效率。優(yōu)秀的程序為后期升級提供便捷的支持！
Taro - 解決H5發(fā)布升級在微信、瀏覽器的緩存問題
發(fā)表時間：2021-1-6
發(fā)布人：葵宇科技
瀏覽次數：138
問題：
我們每次發(fā)布H5更新的時候總會遇到這樣的問題，用戶在微信中看到的H5頁面是沒有改動過的，但是我們明明已經更新了H5，只能清理緩存才能看到最新的修改。
原因：
因為微信官方的web-view 是會緩存頁面靜態(tài)資源的比如：js、css、圖片等，優(yōu)先顯示的緩存中的資源，過一段時間（時間不定，一天或者幾小時，無明顯規(guī)律）是可以自動進行緩存清除的，但是對于當時用戶來說想要第一時間就看到正確的頁面。
如何解決呢？
我們可以對Taro項目的config/index.js文件，進行如下配置：
const config = {
...
h5: {
publicPath: '/',
staticDirectory: 'static',
output: {
filename: 'js/[name].[hash].js',
chunkFilename: 'js/[name].[chunkhash].js'
},
imageUrlLoaderOption: {
limit: 5000,
name: 'static/images/[name].[hash].[ext]'
},
miniCssExtractPluginOption: {
filename: 'css/[name].[hash].css',
chunkFilename: 'css/[name].[chunkhash].css',
},
...
},
}
我來解釋下，咱們配置了靜態(tài)文件的目錄，然后每次通過npm run build:h5命令打包程序的時候，會自動將靜態(tài)資源文件后面追加hash數值（見截圖），這樣靜態(tài)文件發(fā)生變化的時候會生成新的hash值，這樣每次發(fā)包的靜態(tài)文件路徑就是不同的了，所以升級版本就避免了緩存的問題。
打包后的文件截圖：
作者：汗青fullstack
來源：簡書
著作權歸作者所有。商業(yè)轉載請聯(lián)系作者獲得授權，非商業(yè)轉載請注明出處。
