VUE vue-cli3配置打包后的文件加上版本號(hào)

為了實(shí)現(xiàn)項(xiàng)目上傳后不存在緩存問(wèn)題,需要在webpack中加上配置信息
在項(xiàng)目根目錄中添加vue.config.js文件

const Timestamp = new Date().getTime();
module.exports = {
    // webpack配置
    chainWebpack: config => {
        if (process.env.NODE_ENV === 'production') {
            // 給js和css配置版本號(hào)
            config.output.filename('js/[name].' + Timestamp + '.js').end();
            config.output.chunkFilename('js/[name].' + Timestamp + '.js').end();
            config.plugin('extract-css').tap(args => [{
                filename: `css/[name].${Timestamp}.css`,
                chunkFilename: `css/[name].${Timestamp}.css`
            }])
        }
    },
    css: {
        loaderOptions: {
            sass: {
                // 向全局sass樣式傳入共享的全局變量
                data: `@import "@/styles/public.scss";@import "@/styles/element_ui_style.scss";`
            }
        }
    },
    lintOnSave: false,
    productionSourceMap: true,

    //是開發(fā)模式的時(shí)候,獲取當(dāng)前路徑下的地址,是測(cè)試或者開發(fā)模式的時(shí)候,用/獲取地址
    publicPath: process.env.NODE_ENV === 'production' ? './' : '/',
}

或者

// vue.config.js
const Timestamp = new Date().getTime();
module.exports = {
  configureWebpack: { // webpack 配置
    output: { // 輸出重構(gòu)  打包編譯后的 文件名稱  【模塊名稱.版本號(hào).時(shí)間戳】
      filename: `[name].${process.env.VUE_APP_Version}.${Timestamp}.js`,
      chunkFilename: `[name].${process.env.VUE_APP_Version}.${Timestamp}.js`
    },
  },
...
}

js、css加版本號(hào)參考:https://blog.csdn.net/superKM/article/details/102471167?biz_id=102

?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時(shí)請(qǐng)結(jié)合常識(shí)與多方信息審慎甄別。
平臺(tái)聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點(diǎn),簡(jiǎn)書系信息發(fā)布平臺(tái),僅提供信息存儲(chǔ)服務(wù)。

相關(guān)閱讀更多精彩內(nèi)容

友情鏈接更多精彩內(nèi)容