vite中在html文件内使用变量

背景

问题: 前端的配置文件config.js，每次发包都有缓存。
解决: 在js导入的时候加上时间戳

安装 vite-plugin-html 插件

• vite.config.ts

import { createHtmlPlugin } from 'vite-plugin-html'
// ...
plugins: [ 
    vue(),
    createHtmlPlugin({
      inject: {
        data: {
          timeStamp: `?ver=${new Date().getTime()}` // 变量
        }
      }
    }),
]

使用

• 在静态index.html中
• 导入目录public/configjs

    <script type="text/javascript" src="/config.js<%= timeStamp %>"></script>