解决vue线上项目更新后, 用户电脑css缓存的问题

  // 全局混入scss变量
const Timestamp = +new Date()

module.exports = {
  // 全局混入scss变量
  css: {
    loaderOptions: {
      sass: {
        prependData: '@import "./src/styles/variable.scss";'
      }
    },
    extract: {
      filename: `css/[name].${Timestamp}.css`,
      chunkFilename: `css/[name].${Timestamp}.css`
    }
  },
  // devServer: {
  //   proxy: {
  //     '/api': {
  //       target: 'https://test.snail.ssmanage.com',
  //       changeOrigin: true,
  //       pathRewrite: {
  //         '/api': ''
  //       }
  //     }
  //   }
  // }

  // 配置html
  chainWebpack: config => {
    config.plugin('html').tap(args => {
      args[0].title = '热点管理平台'
      return args
    })
  }
}
 extract: {
      filename: `css/[name].${Timestamp}.css`,
      chunkFilename: `css/[name].${Timestamp}.css`
    }

这是 vue.config.js 的配置

重点是  

extract 的配置

服务器更新后, 让 html 访问的静态资源路径发生变化


posted @ 2022-03-01 11:06  深海里的星星i  阅读(298)  评论(0)    收藏  举报