Failed to load module script: Expected a JavaScript module script but the server responded with ....

最近项目在部署时一直会出现一个问题，更新的内容无法及时显示在页面上，并且每次部署完启动项目时（生产或测试环境）会报错

Failed to load module script: Expected a JavaScript module script but the server responded with a MIME type of “text/html”. Strict MIME type checking is enforced for module scripts per HTML spec

这可能是多方面的原因导致的，比如vite.config.ts中的配置原因

export default defineConfig({
  plugins: [react()],
  base: "./"
})

将base属性值 从 ‘./’ 修改为 ‘/’

但我的问题并不是这个,而是我在打包配置中的一个疏忽

build: {
      rollupOptions: {
        output: {
          manualChunks(id) {
            if (id.includes('src/router/index.ts')) {
              return 'router-index'
            }
            return null;
          },
          chunkFileNames: (chunkInfo) => {
            return chunkInfo.name === 'router-index' 
              ? 'router-index.js'
              : 'assets/[name]-[hash].js'
          }
        }
      }
}

解释一下这段代码，我在打包输出的过程中想看一下打包完的router-index.js文件，所以我对这个文件的命名进行了一个处理，如果是路由文件，则文件名就直接使用 router-index.js，并没有使用哈希值命名，所以在每次打包完之后，浏览器加载路由文件时，会发现文件名称没有变化而沿用缓存中的路由文件，所有会出现，更新的内容没有覆盖上去，并且会出现如上的报错，但是当你清空浏览器缓存，会发现又可以了

修改方法：
如果对输出内容没有特定需求可以直接删除这段代码，如果有需求可以像我这样修改

build: {
      rollupOptions: {
        output: {
          manualChunks(id) {
            if (id.includes('src/router/index.ts')) {
              return 'router-index'
            }
            return null;
          },
          chunkFileNames: (chunkInfo) => {
         	 return chunkInfo.name === 'router-index' 
          	  ? `router-index-${Date.now()}.js`  // 添加时间戳
           	 : 'assets/[name]-[hash].js'
        	}
        }
      }
}

在 router-index 文件命名时加上时间戳，就能保证每次打包时路由文件的名称都不一样，这样读取路由文件就不会从浏览器缓存内获取