Enhance Vite configuration with Rollup options for output file naming and add JSON stringification. Update web.config to serve .js and .mjs files with the correct MIME type.

frontend/vite.config.js

@@ -21,7 +21,15 @@ export default defineConfig(({mode}) => {
             host: 'localhost',
         },
         build: {
-            sourcemap: true // Enable source maps for debugging
+            sourcemap: true, // Enable source maps for debugging
+            rollupOptions: {
+                output: {
+                    format: 'es',
+                    entryFileNames: '[name].[hash].js',
+                    chunkFileNames: '[name].[hash].js',
+                    assetFileNames: '[name].[hash].[ext]'
+                }
+            }
         },
         resolve: {
             alias: {
@@ -32,6 +40,9 @@ export default defineConfig(({mode}) => {
             // Define a global constant __APP_ENV__ based on loaded environment variables
             VITE_API_URL: JSON.stringify(env.VITE_API_URL),
             VITE_STRIPE_API_KEY: JSON.stringify(env.VITE_STRIPE_API_KEY)
+        },
+        json: {
+            stringify: true
         }
     }
 })

frontend/web.config

@@ -3,6 +3,13 @@
   <system.webServer>
     <staticContent>
       <mimeMap fileExtension=".json" mimeType="application/json" />
+      <mimeMap fileExtension=".js" mimeType="application/javascript" />
+      <mimeMap fileExtension=".mjs" mimeType="application/javascript" />
     </staticContent>
+    <httpProtocol>
+      <customHeaders>
+        <add name="Content-Type" value="application/javascript" />
+      </customHeaders>
+    </httpProtocol>
   </system.webServer>
 </configuration>