0

I'm having a problem with building file paths in index.html when I run the build command. My app is using vue3 + vite

An issue I'm facing is that the index.html file references to js and css files this way:

<script type="module" crossorigin src="/assets/index.js"></script>
<link rel="modulepreload" href="/assets/vendor.js">
<link rel="stylesheet" href="/assets/style.css">

But I need it to do it this way because my app is having problems with cache in browser:

<script type="module" crossorigin src="/assets/index.js?v=1.1.0"></script>
<link rel="modulepreload" href="/assets/vendor.js?v=1.1.0">
<link rel="stylesheet" href="/assets/style.css?v=1.1.0">

I know that using this option solves the cache problem. But it does change the filename every time I build my app. Since my case needed to keep the filename static to be able to pass through the firewall, something like that

What would I need to add/change in order to get the path structure I want?

Thanks in advance.

Nhu Pham
  • 23
  • 4
  • You are using VUE 3? In VUE 3 there is automatic different URL for assets. Like below – Impunkj Sep 27 '22 at 09:57
  • I understand with hash to get that, as I said above why I have to keep the path and filename static, so I configured the rollupOptions: { output: { entryFileNames: `assets/[name].js`, chunkFileNames: `assets/[name].js`, assetFileNames: `assets/[name].[ext]` } } that's why the file name doesn't change. because if you change it, it won't pass through the firewall – Nhu Pham Sep 27 '22 at 10:12

0 Answers0