feat: add cache busting plugin

packages/hmr/lib/plugins/index.ts

@@ -1 +1,2 @@
 export * from './watch-rebuild-plugin';
+export * from './make-entry-point-plugin';

packages/hmr/lib/plugins/make-entry-point-plugin.ts

@@ -0,0 +1,47 @@
+import * as fs from 'fs';
+import path from 'path';
+import type { PluginOption } from 'vite';
+
+/**
+ * make entry point file for content script cache busting
+ */
+
+export function makeEntryPointPlugin(): PluginOption {
+  const cleanupTargets = new Set<string>();
+  return {
+    name: 'make-entry-point-plugin',
+    generateBundle(options, bundle) {
+      const outputDir = options.dir;
+      if (!outputDir) {
+        throw new Error('Output directory not found');
+      }
+      for (const module of Object.values(bundle)) {
+        const fileName = path.basename(module.fileName);
+        const newFileName = fileName.replace('.js', '_dev.js');
+        switch (module.type) {
+          case 'asset':
+            // map file
+            if (fileName.endsWith('.map')) {
+              cleanupTargets.add(path.resolve(outputDir, fileName));
+              const originalFileName = fileName.replace('.map', '');
+              const replacedSource = String(module.source).replaceAll(originalFileName, newFileName);
+              module.source = '';
+              fs.writeFileSync(path.resolve(outputDir, newFileName), replacedSource);
+              break;
+            }
+            break;
+          case 'chunk': {
+            fs.writeFileSync(path.resolve(outputDir, newFileName), module.code);
+            module.code = `import('./${newFileName}');`;
+            break;
+          }
+        }
+      }
+    },
+    closeBundle() {
+      cleanupTargets.forEach(target => {
+        fs.unlinkSync(target);
+      });
+    },
+  };
+}

pages/content-ui/vite.config.ts

@@ -1,7 +1,7 @@
 import { defineConfig } from 'vite';
 import react from '@vitejs/plugin-react';
 import { resolve } from 'path';
-import { watchRebuildPlugin } from '@chrome-extension-boilerplate/hmr';
+import { makeEntryPointPlugin, watchRebuildPlugin } from '@chrome-extension-boilerplate/hmr';
 
 const rootDir = resolve(__dirname);
 const srcDir = resolve(rootDir, 'src');
@@ -16,7 +16,7 @@ export default defineConfig({
     },
   },
   base: '',
-  plugins: [react(), isDev && watchRebuildPlugin({ refresh: true })],
+  plugins: [react(), isDev && watchRebuildPlugin({ refresh: true }), isDev && makeEntryPointPlugin()],
   publicDir: resolve(rootDir, 'public'),
   build: {
     lib: {

pages/content/vite.config.ts

@@ -1,6 +1,6 @@
 import { defineConfig } from 'vite';
 import { resolve } from 'path';
-import { watchRebuildPlugin } from '@chrome-extension-boilerplate/hmr';
+import { makeEntryPointPlugin, watchRebuildPlugin } from '@chrome-extension-boilerplate/hmr';
 
 const rootDir = resolve(__dirname);
 const libDir = resolve(rootDir, 'lib');
@@ -14,7 +14,7 @@ export default defineConfig({
       '@lib': libDir,
     },
   },
-  plugins: [isDev && watchRebuildPlugin({ refresh: true })],
+  plugins: [isDev && watchRebuildPlugin({ refresh: true }), isDev && makeEntryPointPlugin()],
   publicDir: resolve(rootDir, 'public'),
   build: {
     lib: {

turbo.json

@@ -2,6 +2,7 @@
   "$schema": "https://turbo.build/schema.json",
   "pipeline": {
     "dev": {
+      "dependsOn": ["^build"],
       "outputs": ["dist/**", "build/**"],
       "persistent": true
     },