关于uni.app H5页面 CSS、JS缓存

关于uni.app H5页面 JS缓存

uni打包发布的H5，每次在测试的时候，新用户在浏览器打开能浏览到新页面，但是旧用户在浏览器打开页面会存在缓存问题，浏览到的还是旧页面，使用浏览器强制刷新后，可以浏览到页面的新样式。

我们要怎么解决这个问题呢？

关于JS缓存问题

在项目manifest.json同一级目录下创建vue.config.js文件，在js文件添加时间戳

if (process.env.UNI_PLATFORM === 'h5') {
  let filePath = 'static/js/'
  let Timestamp = new Date().getTime()
  module.exports = {
    // webpack配置
    filenameHashing: false,
    configureWebpack: {
      // webpack 配置 解决js缓存的问题
      output: {
        // 输出重构  打包编译后的 文件目录/文件名称?v=时间戳
        filename: `${filePath}[name].js?v=${Timestamp}`,
        chunkFilename: `${filePath}[name].js?v=${Timestamp}`,
      },
    },
  }
} else {
  // 其他打包配置
  module.exports = {
    // webpack 相关配置
    filenameHashing: false,
  }
}

CSS样式缓存问题

查看H5配置的模板文件

官网有这个模板页面，官网模板配置跳转