wxt 0.0.2 → 0.1.1-alpha1

package/dist/index.cjs

@@ -34,8 +34,7 @@ __export(src_exports, {
   createServer: () => createServer2,
   defineConfig: () => defineConfig,
   defineRunnerConfig: () => defineRunnerConfig,
-  rebuild: () => rebuild,
-  version: () => version
+  version: () => version2
 });
 module.exports = __toCommonJS(src_exports);
 
@@ -50,24 +49,26 @@ var import_jiti = __toESM(require("jiti"), 1);
 var import_babel = __toESM(require("jiti/dist/babel"), 1);
 var import_path = require("path");
 var import_unimport = require("unimport");
+var import_fs_extra = __toESM(require("fs-extra"), 1);
 async function importTsFile(root, path5) {
-  const clientImports = await (0, import_unimport.scanExports)(
+  const unimport2 = (0, import_unimport.createUnimport)({});
+  await unimport2.scanImportsFromFile(
     (0, import_path.resolve)(root, "node_modules/wxt/dist/client.js")
   );
+  const text = await import_fs_extra.default.readFile(path5, "utf-8");
+  const res = await unimport2.injectImports(text, path5);
+  const transformedText = res.code;
   const jiti = (0, import_jiti.default)(__filename, {
     cache: false,
     esmResolve: true,
     interopDefault: true,
+    alias: {
+      "webextension-polyfill": "wxt"
+    },
     transform(opts) {
+      if (opts.filename === path5)
+        opts.source = transformedText;
       opts.source = opts.source.replace(/^import ['"].*\.css['"];?$/gm, "");
-      opts.source = opts.source.replace(
-        /^import\s+.*\s+from ['"]webextension-polyfill['"];?$/gm,
-        ""
-      );
-      if (opts.filename === path5) {
-        const imports = clientImports.map((i) => `import { ${i.name} } from "${i.from}";`).join("\n") + "\n";
-        opts.source = imports + opts.source;
-      }
       return (0, import_babel.default)(opts);
     }
   });
@@ -250,7 +251,7 @@ function download(config) {
 
 // src/core/vite-plugins/multipageMove.ts
 var import_node_path2 = require("path");
-var import_fs_extra = __toESM(require("fs-extra"), 1);
+var import_fs_extra2 = __toESM(require("fs-extra"), 1);
 function multipageMove(entrypoints, config) {
   return {
     name: "wxt:multipage-move",
@@ -277,8 +278,8 @@ function multipageMove(entrypoints, config) {
         }
         const oldAbsPath = (0, import_node_path2.resolve)(config.outDir, oldBundlePath);
         const newAbsPath = (0, import_node_path2.resolve)(config.outDir, newBundlePath);
-        await (0, import_fs_extra.ensureDir)((0, import_node_path2.dirname)(newAbsPath));
-        await import_fs_extra.default.move(oldAbsPath, newAbsPath, { overwrite: true });
+        await (0, import_fs_extra2.ensureDir)((0, import_node_path2.dirname)(newAbsPath));
+        await import_fs_extra2.default.move(oldAbsPath, newAbsPath, { overwrite: true });
         const renamedChunk = {
           ...bundle[oldBundlePath],
           fileName: newBundlePath
@@ -328,7 +329,7 @@ function unimport(config) {
 }
 
 // src/core/vite-plugins/virtualEntrypoint.ts
-var import_fs_extra2 = __toESM(require("fs-extra"), 1);
+var import_fs_extra3 = __toESM(require("fs-extra"), 1);
 var import_path3 = require("path");
 function virtualEntrypoin(type, config) {
   const virtualId = `virtual:wxt-${type}?`;
@@ -346,7 +347,7 @@ function virtualEntrypoin(type, config) {
       if (!id.startsWith(resolvedVirtualId))
         return;
       const inputPath = id.replace(resolvedVirtualId, "");
-      const template = await import_fs_extra2.default.readFile(
+      const template = await import_fs_extra3.default.readFile(
         (0, import_path3.resolve)(
           config.root,
           `node_modules/wxt/dist/virtual-modules/${type}-entrypoint.js`
@@ -359,20 +360,20 @@ function virtualEntrypoin(type, config) {
 }
 
 // src/core/utils/createFsCache.ts
-var import_fs_extra3 = __toESM(require("fs-extra"), 1);
+var import_fs_extra4 = __toESM(require("fs-extra"), 1);
 var import_path4 = require("path");
 function createFsCache(wxtDir) {
   const getPath = (key) => (0, import_path4.resolve)(wxtDir, "cache", encodeURIComponent(key));
   return {
     async set(key, value) {
       const path5 = getPath(key);
-      await (0, import_fs_extra3.ensureDir)((0, import_path4.dirname)(path5));
-      await import_fs_extra3.default.writeFile(path5, value, "utf-8");
+      await (0, import_fs_extra4.ensureDir)((0, import_path4.dirname)(path5));
+      await import_fs_extra4.default.writeFile(path5, value, "utf-8");
     },
     async get(key) {
       const path5 = getPath(key);
       try {
-        return await import_fs_extra3.default.readFile(path5, "utf-8");
+        return await import_fs_extra4.default.readFile(path5, "utf-8");
       } catch {
         return void 0;
       }
@@ -511,15 +512,246 @@ async function getInternalConfig(config, command) {
   return finalConfig;
 }
 
+// src/index.ts
+var import_picocolors3 = __toESM(require("picocolors"), 1);
+var vite6 = __toESM(require("vite"), 1);
+
+// src/core/utils/arrays.ts
+function every(array, predicate) {
+  for (let i = 0; i < array.length; i++)
+    if (!predicate(array[i], i))
+      return false;
+  return true;
+}
+
+// src/core/utils/detectDevChanges.ts
+function detectDevChanges(changedFiles, currentOutput) {
+  if (currentOutput == null)
+    return { type: "no-change" };
+  const changedSteps = new Set(
+    changedFiles.flatMap(
+      (changedFile) => findEffectedSteps(changedFile, currentOutput)
+    )
+  );
+  if (changedSteps.size === 0)
+    return { type: "no-change" };
+  const unchangedOutput = {
+    manifest: currentOutput.manifest,
+    steps: [],
+    publicAssets: []
+  };
+  const changedOutput = {
+    manifest: currentOutput.manifest,
+    steps: [],
+    publicAssets: []
+  };
+  for (const step of currentOutput.steps) {
+    if (changedSteps.has(step)) {
+      changedOutput.steps.push(step);
+    } else {
+      unchangedOutput.steps.push(step);
+    }
+  }
+  for (const asset of currentOutput.publicAssets) {
+    if (changedSteps.has(asset)) {
+      changedOutput.publicAssets.push(asset);
+    } else {
+      unchangedOutput.publicAssets.push(asset);
+    }
+  }
+  const isOnlyHtmlChanges = changedFiles.length > 0 && every(changedFiles, ([_, file]) => file.endsWith(".html"));
+  if (isOnlyHtmlChanges) {
+    return {
+      type: "html-reload",
+      cachedOutput: unchangedOutput,
+      rebuildGroups: changedOutput.steps.map((step) => step.entrypoints)
+    };
+  }
+  const isOnlyContentScripts = changedOutput.steps.length > 0 && every(
+    changedOutput.steps.flatMap((step) => step.entrypoints),
+    (entry) => entry.type === "content-script"
+  );
+  if (isOnlyContentScripts) {
+    return {
+      type: "content-script-reload",
+      cachedOutput: unchangedOutput,
+      changedSteps: changedOutput.steps,
+      rebuildGroups: changedOutput.steps.map((step) => step.entrypoints)
+    };
+  }
+  return {
+    type: "extension-reload",
+    cachedOutput: unchangedOutput,
+    rebuildGroups: changedOutput.steps.map((step) => step.entrypoints)
+  };
+}
+function findEffectedSteps(changedFile, currentOutput) {
+  const changes = [];
+  const changedPath = changedFile[1];
+  const isChunkEffected = (chunk) => (
+    // If it's an HTML file with the same path, is is effected because HTML files need to be pre-rendered
+    // TODO: use bundle path to support `<name>/index.html`?
+    chunk.type === "asset" && changedPath.endsWith(chunk.fileName) || // If it's a chunk that depends on the changed file, it is effected
+    chunk.type === "chunk" && chunk.moduleIds.includes(changedPath)
+  );
+  for (const step of currentOutput.steps) {
+    const effectedChunk = step.chunks.find((chunk) => isChunkEffected(chunk));
+    if (effectedChunk)
+      changes.push(step);
+  }
+  const effectedAsset = currentOutput.publicAssets.find(
+    (chunk) => isChunkEffected(chunk)
+  );
+  if (effectedAsset)
+    changes.push(effectedAsset);
+  return changes;
+}
+
+// src/index.ts
+var import_async_mutex = require("async-mutex");
+var import_consola3 = require("consola");
+var import_node_path4 = require("path");
+
+// src/core/build/buildEntrypoints.ts
+var vite3 = __toESM(require("vite"), 1);
+
+// src/core/utils/removeEmptyDirs.ts
+var import_fs_extra5 = __toESM(require("fs-extra"), 1);
+var import_path5 = __toESM(require("path"), 1);
+async function removeEmptyDirs(dir) {
+  const files = await import_fs_extra5.default.readdir(dir);
+  for (const file of files) {
+    const filePath = import_path5.default.join(dir, file);
+    const stats = await import_fs_extra5.default.stat(filePath);
+    if (stats.isDirectory()) {
+      await removeEmptyDirs(filePath);
+    }
+  }
+  try {
+    await import_fs_extra5.default.rmdir(dir);
+  } catch {
+  }
+}
+
+// src/core/build/buildEntrypoints.ts
+var import_fast_glob = __toESM(require("fast-glob"), 1);
+var import_fs_extra6 = __toESM(require("fs-extra"), 1);
+var import_path6 = require("path");
+async function buildEntrypoints(groups, config) {
+  const steps = [];
+  for (const group of groups) {
+    const step = Array.isArray(group) ? await buildMultipleEntrypoints(group, config) : await buildSingleEntrypoint(group, config);
+    steps.push(step);
+  }
+  const publicAssets = await copyPublicDirectory(config);
+  await removeEmptyDirs(config.outDir);
+  return { publicAssets, steps };
+}
+async function buildSingleEntrypoint(entrypoint, config) {
+  const isVirtual = ["background", "content-script"].includes(entrypoint.type);
+  const entry = isVirtual ? `virtual:wxt-${entrypoint.type}?${entrypoint.inputPath}` : entrypoint.inputPath;
+  const libMode = {
+    build: {
+      lib: {
+        entry,
+        formats: ["iife"],
+        name: entrypoint.name,
+        fileName: entrypoint.name
+      },
+      rollupOptions: {
+        output: {
+          // There's only a single output for this build, so we use the desired bundle path for the
+          // entry output (like "content-scripts/overlay.js")
+          entryFileNames: getEntrypointBundlePath(
+            entrypoint,
+            config.outDir,
+            ".js"
+          ),
+          // Output content script CSS to assets/ with a hash to prevent conflicts. Defaults to
+          // "[name].[ext]" in lib mode, which usually results in "style.css". That means multiple
+          // content scripts with styles would overwrite each other if it weren't changed below.
+          assetFileNames: `assets/${entrypoint.name}.[ext]`
+        }
+      }
+    }
+  };
+  const entryConfig = vite3.mergeConfig(
+    libMode,
+    config.vite
+  );
+  const result = await vite3.build(entryConfig);
+  return {
+    entrypoints: entrypoint,
+    chunks: getBuildOutputChunks(result)
+  };
+}
+async function buildMultipleEntrypoints(entrypoints, config) {
+  const multiPage = {
+    plugins: [multipageMove(entrypoints, config)],
+    build: {
+      rollupOptions: {
+        input: entrypoints.reduce((input, entry) => {
+          input[entry.name] = entry.inputPath;
+          return input;
+        }, {}),
+        output: {
+          // Include a hash to prevent conflicts
+          chunkFileNames: "chunks/[name]-[hash].js",
+          // Include a hash to prevent conflicts
+          entryFileNames: "chunks/[name]-[hash].js",
+          // We can't control the "name", so we need a hash to prevent conflicts
+          assetFileNames: "assets/[name]-[hash].[ext]"
+        }
+      }
+    }
+  };
+  const entryConfig = vite3.mergeConfig(
+    multiPage,
+    config.vite
+  );
+  const result = await vite3.build(entryConfig);
+  return {
+    entrypoints,
+    chunks: getBuildOutputChunks(result)
+  };
+}
+function getBuildOutputChunks(result) {
+  if ("on" in result)
+    throw Error("wxt does not support vite watch mode.");
+  if (Array.isArray(result))
+    return result.flatMap(({ output }) => output);
+  return result.output;
+}
+async function copyPublicDirectory(config) {
+  const publicAssets = [];
+  if (!await import_fs_extra6.default.exists(config.publicDir))
+    return publicAssets;
+  const files = await (0, import_fast_glob.default)("**/*", { cwd: config.publicDir });
+  for (const file of files) {
+    const srcPath = (0, import_path6.resolve)(config.publicDir, file);
+    const outPath = (0, import_path6.resolve)(config.outDir, file);
+    await import_fs_extra6.default.ensureDir((0, import_path6.dirname)(outPath));
+    await import_fs_extra6.default.copyFile(srcPath, outPath);
+    publicAssets.push({
+      type: "asset",
+      fileName: file,
+      name: file,
+      needsCodeReference: false,
+      source: await import_fs_extra6.default.readFile(srcPath)
+    });
+  }
+  return publicAssets;
+}
+
 // src/core/build/findEntrypoints.ts
-var import_path5 = require("path");
-var import_fs_extra4 = __toESM(require("fs-extra"), 1);
+var import_path7 = require("path");
+var import_fs_extra7 = __toESM(require("fs-extra"), 1);
 var import_picomatch = __toESM(require("picomatch"), 1);
 var import_linkedom2 = require("linkedom");
 var import_json5 = __toESM(require("json5"), 1);
-var import_fast_glob = __toESM(require("fast-glob"), 1);
+var import_fast_glob2 = __toESM(require("fast-glob"), 1);
 async function findEntrypoints(config) {
-  const relativePaths = await (0, import_fast_glob.default)("**/*", {
+  const relativePaths = await (0, import_fast_glob2.default)("**/*", {
     cwd: config.entrypointsDir
   });
   relativePaths.sort();
@@ -528,7 +760,7 @@ async function findEntrypoints(config) {
   const entrypoints = [];
   await Promise.all(
     relativePaths.map(async (relativePath) => {
-      const path5 = (0, import_path5.resolve)(config.entrypointsDir, relativePath);
+      const path5 = (0, import_path7.resolve)(config.entrypointsDir, relativePath);
       const matchingGlob = pathGlobs.find(
         (glob3) => import_picomatch.default.isMatch(relativePath, glob3)
       );
@@ -575,8 +807,8 @@ ${JSON.stringify(
       if (withSameName) {
         throw Error(
           `Multiple entrypoints with the name "${entrypoint.name}" detected, but only one is allowed: ${[
-            (0, import_path5.relative)(config.root, withSameName.inputPath),
-            (0, import_path5.relative)(config.root, entrypoint.inputPath)
+            (0, import_path7.relative)(config.root, withSameName.inputPath),
+            (0, import_path7.relative)(config.root, entrypoint.inputPath)
           ].join(", ")}`
         );
       }
@@ -588,7 +820,7 @@ ${JSON.stringify(
 }
 async function getPopupEntrypoint(config, path5) {
   const options = {};
-  const content = await import_fs_extra4.default.readFile(path5, "utf-8");
+  const content = await import_fs_extra7.default.readFile(path5, "utf-8");
   const { document } = (0, import_linkedom2.parseHTML)(content);
   const title = document.querySelector("title");
   if (title != null)
@@ -618,7 +850,7 @@ async function getPopupEntrypoint(config, path5) {
 }
 async function getOptionsEntrypoint(config, path5) {
   const options = {};
-  const content = await import_fs_extra4.default.readFile(path5, "utf-8");
+  const content = await import_fs_extra7.default.readFile(path5, "utf-8");
   const { document } = (0, import_linkedom2.parseHTML)(content);
   const openInTabContent = document.querySelector("meta[name='manifest.open_in_tab']")?.getAttribute("content");
   if (openInTabContent) {
@@ -665,7 +897,7 @@ async function getContentScriptEntrypoint(config, name, path5) {
     type: "content-script",
     name: getEntrypointName(config.entrypointsDir, path5),
     inputPath: path5,
-    outputDir: (0, import_path5.resolve)(config.outDir, "content-scripts"),
+    outputDir: (0, import_path7.resolve)(config.outDir, "content-scripts"),
     options
   };
 }
@@ -700,140 +932,112 @@ var PATH_GLOB_TO_TYPE_MAP = {
   "*/*": "ignored"
 };
 
-// src/core/build/buildEntrypoints.ts
-var vite3 = __toESM(require("vite"), 1);
-
-// src/core/utils/removeEmptyDirs.ts
-var import_fs_extra5 = __toESM(require("fs-extra"), 1);
-var import_path6 = __toESM(require("path"), 1);
-async function removeEmptyDirs(dir) {
-  const files = await import_fs_extra5.default.readdir(dir);
-  for (const file of files) {
-    const filePath = import_path6.default.join(dir, file);
-    const stats = await import_fs_extra5.default.stat(filePath);
-    if (stats.isDirectory()) {
-      await removeEmptyDirs(filePath);
-    }
-  }
-  try {
-    await import_fs_extra5.default.rmdir(dir);
-  } catch {
-  }
+// src/core/build/generateTypesDir.ts
+var import_unimport3 = require("unimport");
+var import_fs_extra8 = __toESM(require("fs-extra"), 1);
+var import_path8 = require("path");
+async function generateTypesDir(entrypoints, config) {
+  await import_fs_extra8.default.ensureDir(config.typesDir);
+  const references = [];
+  references.push(await writeImportsDeclarationFile(config));
+  references.push(await writePathsDeclarationFile(entrypoints, config));
+  references.push(await writeGlobalsDeclarationFile(config));
+  const mainReference = await writeMainDeclarationFile(references, config);
+  await writeTsConfigFile(mainReference, config);
 }
-
-// src/core/build/buildEntrypoints.ts
-var import_fast_glob2 = __toESM(require("fast-glob"), 1);
-var import_fs_extra6 = __toESM(require("fs-extra"), 1);
-var import_path7 = require("path");
-async function buildEntrypoints(groups, config) {
-  const steps = [];
-  for (const group of groups) {
-    const step = Array.isArray(group) ? await buildMultipleEntrypoints(group, config) : await buildSingleEntrypoint(group, config);
-    steps.push(step);
-  }
-  const publicAssets = await copyPublicDirectory(config);
-  await removeEmptyDirs(config.outDir);
-  return { publicAssets, steps };
+async function writeImportsDeclarationFile(config) {
+  const filePath = (0, import_path8.resolve)(config.typesDir, "imports.d.ts");
+  const unimport2 = (0, import_unimport3.createUnimport)(getUnimportOptions(config));
+  await unimport2.scanImportsFromDir(void 0, { cwd: config.srcDir });
+  await import_fs_extra8.default.writeFile(
+    filePath,
+    ["// Generated by wxt", await unimport2.generateTypeDeclarations()].join(
+      "\n"
+    ) + "\n"
+  );
+  return filePath;
 }
-async function buildSingleEntrypoint(entrypoint, config) {
-  const isVirtual = ["background", "content-script"].includes(entrypoint.type);
-  const entry = isVirtual ? `virtual:wxt-${entrypoint.type}?${entrypoint.inputPath}` : entrypoint.inputPath;
-  const libMode = {
-    build: {
-      lib: {
-        entry,
-        formats: ["iife"],
-        name: entrypoint.name,
-        fileName: entrypoint.name
-      },
-      rollupOptions: {
-        output: {
-          // There's only a single output for this build, so we use the desired bundle path for the
-          // entry output (like "content-scripts/overlay.js")
-          entryFileNames: getEntrypointBundlePath(
-            entrypoint,
-            config.outDir,
-            ".js"
-          ),
-          // Output content script CSS to assets/ with a hash to prevent conflicts. Defaults to
-          // "[name].[ext]" in lib mode, which usually results in "style.css". That means multiple
-          // content scripts with styles would overwrite each other if it weren't changed below.
-          assetFileNames: `assets/${entrypoint.name}.[ext]`
-        }
-      }
-    }
-  };
-  const entryConfig = vite3.mergeConfig(
-    libMode,
-    config.vite
+async function writePathsDeclarationFile(entrypoints, config) {
+  const filePath = (0, import_path8.resolve)(config.typesDir, "paths.d.ts");
+  await import_fs_extra8.default.writeFile(
+    filePath,
+    [
+      "// Generated by wxt",
+      "type EntrypointPath =",
+      ...entrypoints.map((entry) => {
+        const path5 = getEntrypointBundlePath(
+          entry,
+          config.outDir,
+          entry.inputPath.endsWith(".html") ? ".html" : ".js"
+        );
+        return `  | "/${path5}"`;
+      }).sort()
+    ].join("\n") + "\n"
   );
-  const result = await vite3.build(entryConfig);
-  return {
-    entrypoints: entrypoint,
-    chunks: getBuildOutputChunks(result)
-  };
+  return filePath;
 }
-async function buildMultipleEntrypoints(entrypoints, config) {
-  const multiPage = {
-    plugins: [multipageMove(entrypoints, config)],
-    build: {
-      rollupOptions: {
-        input: entrypoints.reduce((input, entry) => {
-          input[entry.name] = entry.inputPath;
-          return input;
-        }, {}),
-        output: {
-          // Include a hash to prevent conflicts
-          chunkFileNames: "chunks/[name]-[hash].js",
-          // Include a hash to prevent conflicts
-          entryFileNames: "chunks/[name]-[hash].js",
-          // We can't control the "name", so we need a hash to prevent conflicts
-          assetFileNames: "assets/[name]-[hash].[ext]"
-        }
-      }
-    }
-  };
-  const entryConfig = vite3.mergeConfig(
-    multiPage,
-    config.vite
+async function writeGlobalsDeclarationFile(config) {
+  const filePath = (0, import_path8.resolve)(config.typesDir, "globals.d.ts");
+  const globals = getGlobals(config);
+  await import_fs_extra8.default.writeFile(
+    filePath,
+    [
+      "// Generated by wxt",
+      "export {}",
+      "declare global {",
+      ...globals.map((global) => `  const ${global.name}: ${global.type};`),
+      "}"
+    ].join("\n") + "\n",
+    "utf-8"
   );
-  const result = await vite3.build(entryConfig);
-  return {
-    entrypoints,
-    chunks: getBuildOutputChunks(result)
-  };
+  return filePath;
 }
-function getBuildOutputChunks(result) {
-  if ("on" in result)
-    throw Error("wxt does not support vite watch mode.");
-  if (Array.isArray(result))
-    return result.flatMap(({ output }) => output);
-  return result.output;
+async function writeMainDeclarationFile(references, config) {
+  const dir = config.wxtDir;
+  const filePath = (0, import_path8.resolve)(dir, "wxt.d.ts");
+  await import_fs_extra8.default.writeFile(
+    filePath,
+    [
+      "// Generated by wxt",
+      ...references.map(
+        (ref) => `/// <reference types="./${(0, import_path8.relative)(dir, ref)}" />`
+      )
+    ].join("\n") + "\n"
+  );
+  return filePath;
 }
-async function copyPublicDirectory(config) {
-  const publicAssets = [];
-  if (!await import_fs_extra6.default.exists(config.publicDir))
-    return publicAssets;
-  const files = await (0, import_fast_glob2.default)("**/*", { cwd: config.publicDir });
-  for (const file of files) {
-    const srcPath = (0, import_path7.resolve)(config.publicDir, file);
-    const outPath = (0, import_path7.resolve)(config.outDir, file);
-    await import_fs_extra6.default.ensureDir((0, import_path7.dirname)(outPath));
-    await import_fs_extra6.default.copyFile(srcPath, outPath);
-    publicAssets.push({
-      type: "asset",
-      fileName: file,
-      name: file,
-      needsCodeReference: false,
-      source: await import_fs_extra6.default.readFile(srcPath)
-    });
-  }
-  return publicAssets;
+async function writeTsConfigFile(mainReference, config) {
+  const dir = config.wxtDir;
+  await import_fs_extra8.default.writeFile(
+    (0, import_path8.resolve)(dir, "tsconfig.json"),
+    `{
+  "compilerOptions": {
+    "target": "ESNext",
+    "module": "ESNext",
+    "moduleResolution": "Bundler",
+    "noEmit": true,
+    "esModuleInterop": true,
+    "forceConsistentCasingInFileNames": true,
+    "resolveJsonModule": true,
+
+    /* Type Checking */
+    "strict": true,
+
+    /* Completeness */
+    "skipLibCheck": true
+  },
+  "include": [
+    "${(0, import_path8.relative)(dir, config.root)}/**/*",
+    "./${(0, import_path8.relative)(dir, mainReference)}"
+  ],
+  "exclude": ["${(0, import_path8.relative)(dir, config.outBaseDir)}"]
+}`
+  );
 }
 
 // src/core/utils/manifest.ts
-var import_fs_extra7 = __toESM(require("fs-extra"), 1);
-var import_path8 = require("path");
+var import_fs_extra9 = __toESM(require("fs-extra"), 1);
+var import_path9 = require("path");
 
 // src/core/utils/ContentSecurityPolicy.ts
 var ContentSecurityPolicy = class _ContentSecurityPolicy {
@@ -881,8 +1085,8 @@ var ContentSecurityPolicy = class _ContentSecurityPolicy {
 // src/core/utils/manifest.ts
 async function writeManifest(manifest, output, config) {
   const str = config.mode === "production" ? JSON.stringify(manifest) : JSON.stringify(manifest, null, 2);
-  await import_fs_extra7.default.ensureDir(config.outDir);
-  await import_fs_extra7.default.writeFile((0, import_path8.resolve)(config.outDir, "manifest.json"), str, "utf-8");
+  await import_fs_extra9.default.ensureDir(config.outDir);
+  await import_fs_extra9.default.writeFile((0, import_path9.resolve)(config.outDir, "manifest.json"), str, "utf-8");
   output.publicAssets.unshift({
     type: "asset",
     fileName: "manifest.json",
@@ -910,10 +1114,12 @@ async function generateMainfest(entrypoints, buildOutput, config) {
   addEntrypoints(manifest, entrypoints, buildOutput, config);
   if (config.command === "serve")
     addDevModeCsp(manifest, config);
+  if (config.command === "serve")
+    addDevModePermissions(manifest, config);
   return manifest;
 }
 async function getPackageJson(config) {
-  return await import_fs_extra7.default.readJson((0, import_path8.resolve)(config.root, "package.json"));
+  return await import_fs_extra9.default.readJson((0, import_path9.resolve)(config.root, "package.json"));
 }
 function simplifyVersion(versionName) {
   const version3 = /^((0|[1-9][0-9]{0,8})([.](0|[1-9][0-9]{0,8})){0,3}).*$/.exec(
@@ -1066,23 +1272,23 @@ function addEntrypoints(manifest, entrypoints, buildOutput, config) {
     }
   }
   if (contentScripts?.length) {
-    if (config.command === "serve") {
-      const permissionsKey = config.manifestVersion === 2 ? "permissions" : "host_permissions";
-      const hostPermissions = new Set(manifest[permissionsKey] ?? []);
+    if (config.command === "serve" && config.manifestVersion === 3) {
+      const hostPermissions = new Set(manifest.host_permissions ?? []);
       contentScripts.forEach((script) => {
         script.options.matches.forEach((matchPattern) => {
           hostPermissions.add(matchPattern);
         });
       });
-      manifest[permissionsKey] = Array.from(hostPermissions).sort();
+      hostPermissions.forEach(
+        (permission) => addHostPermission(manifest, permission)
+      );
     } else {
       const hashToEntrypointsMap = contentScripts.reduce((map, script) => {
         const hash = JSON.stringify(script.options);
-        if (!map.has(hash)) {
-          map.set(hash, [script]);
-        } else {
+        if (map.has(hash))
           map.get(hash)?.push(script);
-        }
+        else
+          map.set(hash, [script]);
         return map;
       }, /* @__PURE__ */ new Map());
       manifest.content_scripts = Array.from(hashToEntrypointsMap.entries()).map(
@@ -1103,13 +1309,9 @@ function addDevModeCsp(manifest, config) {
   const permission = `http://${config.server?.hostname ?? ""}/*`;
   const allowedCsp = config.server?.origin ?? "http://localhost:*";
   if (manifest.manifest_version === 3) {
-    manifest.host_permissions ??= [];
-    if (!manifest.host_permissions.includes(permission))
-      manifest.host_permissions.push(permission);
+    addHostPermission(manifest, permission);
   } else {
-    manifest.permissions ??= [];
-    if (!manifest.permissions.includes(permission))
-      manifest.permissions.push(permission);
+    addPermission(manifest, permission);
   }
   const csp = new ContentSecurityPolicy(
     manifest.manifest_version === 3 ? (
@@ -1127,6 +1329,11 @@ function addDevModeCsp(manifest, config) {
     manifest.content_security_policy = csp.toString();
   }
 }
+function addDevModePermissions(manifest, config) {
+  addPermission(manifest, "tabs");
+  if (config.manifestVersion === 3)
+    addPermission(manifest, "scripting");
+}
 function getContentScriptCssFiles(contentScripts, buildOutput) {
   const css = [];
   const allChunks = buildOutput.steps.flatMap((step) => step.chunks);
@@ -1141,9 +1348,71 @@ function getContentScriptCssFiles(contentScripts, buildOutput) {
     return css;
   return void 0;
 }
+function addPermission(manifest, permission) {
+  manifest.permissions ??= [];
+  if (manifest.permissions.includes(permission))
+    return;
+  manifest.permissions.push(permission);
+}
+function addHostPermission(manifest, hostPermission) {
+  manifest.host_permissions ??= [];
+  if (manifest.host_permissions.includes(hostPermission))
+    return;
+  manifest.host_permissions.push(hostPermission);
+}
+
+// src/core/build.ts
+var import_picocolors2 = __toESM(require("picocolors"), 1);
+var vite4 = __toESM(require("vite"), 1);
+var import_fs_extra11 = __toESM(require("fs-extra"), 1);
+
+// src/core/utils/groupEntrypoints.ts
+function groupEntrypoints(entrypoints) {
+  const groupIndexMap = {};
+  const groups = [];
+  for (const entry of entrypoints) {
+    const group = ENTRY_TYPE_TO_GROUP_MAP[entry.type];
+    if (group === "no-group") {
+      groups.push(entry);
+    } else {
+      let groupIndex = groupIndexMap[group];
+      if (groupIndex == null) {
+        groupIndex = groups.push([]) - 1;
+        groupIndexMap[group] = groupIndex;
+      }
+      groups[groupIndex].push(entry);
+    }
+  }
+  return groups;
+}
+var ENTRY_TYPE_TO_GROUP_MAP = {
+  sandbox: "sandbox-page",
+  popup: "extension-page",
+  newtab: "extension-page",
+  history: "extension-page",
+  options: "extension-page",
+  devtools: "extension-page",
+  bookmarks: "extension-page",
+  sidepanel: "extension-page",
+  "unlisted-page": "extension-page",
+  background: "no-group",
+  "content-script": "no-group",
+  "unlisted-script": "no-group"
+};
+
+// src/core/utils/formatDuration.ts
+function formatDuration(duration) {
+  if (duration < 1e3)
+    return `${duration} ms`;
+  if (duration < 1e4)
+    return `${(duration / 1e3).toFixed(3)} s`;
+  if (duration < 6e4)
+    return `${(duration / 1e3).toFixed(1)} s`;
+  return `${(duration / 1e3).toFixed(0)} s`;
+}
 
 // src/core/log/printBuildSummary.ts
-var import_path9 = __toESM(require("path"), 1);
+var import_path10 = __toESM(require("path"), 1);
 
 // src/core/log/printTable.ts
 function printTable(log, rows, gap = 2) {
@@ -1173,15 +1442,15 @@ function printTable(log, rows, gap = 2) {
 
 // src/core/log/printBuildSummary.ts
 var import_picocolors = __toESM(require("picocolors"), 1);
-var import_fs_extra8 = __toESM(require("fs-extra"), 1);
+var import_fs_extra10 = __toESM(require("fs-extra"), 1);
 var import_filesize = require("filesize");
 async function printBuildSummary(output, config) {
   const chunks = [
     ...output.steps.flatMap((step) => step.chunks),
     ...output.publicAssets
   ].sort((l, r) => {
-    const lWeight = CHUNK_SORT_WEIGHTS[l.fileName] ?? CHUNK_SORT_WEIGHTS[(0, import_path9.extname)(l.fileName)] ?? DEFAULT_SORT_WEIGHT;
-    const rWeight = CHUNK_SORT_WEIGHTS[r.fileName] ?? CHUNK_SORT_WEIGHTS[(0, import_path9.extname)(r.fileName)] ?? DEFAULT_SORT_WEIGHT;
+    const lWeight = CHUNK_SORT_WEIGHTS[l.fileName] ?? CHUNK_SORT_WEIGHTS[(0, import_path10.extname)(l.fileName)] ?? DEFAULT_SORT_WEIGHT;
+    const rWeight = CHUNK_SORT_WEIGHTS[r.fileName] ?? CHUNK_SORT_WEIGHTS[(0, import_path10.extname)(r.fileName)] ?? DEFAULT_SORT_WEIGHT;
     const diff = lWeight - rWeight;
     if (diff !== 0)
       return diff;
@@ -1191,13 +1460,13 @@ async function printBuildSummary(output, config) {
   const chunkRows = await Promise.all(
     chunks.map(async (chunk, i) => {
       const file = [
-        (0, import_path9.relative)(process.cwd(), config.outDir) + import_path9.default.sep,
+        (0, import_path10.relative)(process.cwd(), config.outDir) + import_path10.default.sep,
         chunk.fileName
       ];
-      const ext = (0, import_path9.extname)(chunk.fileName);
+      const ext = (0, import_path10.extname)(chunk.fileName);
       const prefix = i === chunks.length - 1 ? "  \u2514\u2500" : "  \u251C\u2500";
       const color = CHUNK_COLORS[ext] ?? DEFAULT_COLOR;
-      const stats = await import_fs_extra8.default.lstat((0, import_path9.resolve)(config.outDir, chunk.fileName));
+      const stats = await import_fs_extra10.default.lstat((0, import_path10.resolve)(config.outDir, chunk.fileName));
       totalSize += stats.size;
       const size = String((0, import_filesize.filesize)(stats.size));
       return [
@@ -1225,115 +1494,63 @@ var CHUNK_COLORS = {
   ".js": import_picocolors.default.cyan
 };
 
-// src/index.ts
-var import_fs_extra10 = __toESM(require("fs-extra"), 1);
-
-// src/core/build/generateTypesDir.ts
-var import_unimport3 = require("unimport");
-var import_fs_extra9 = __toESM(require("fs-extra"), 1);
-var import_path10 = require("path");
-async function generateTypesDir(entrypoints, config) {
-  await import_fs_extra9.default.ensureDir(config.typesDir);
-  const references = [];
-  references.push(await writeImportsDeclarationFile(config));
-  references.push(await writePathsDeclarationFile(entrypoints, config));
-  references.push(await writeGlobalsDeclarationFile(config));
-  const mainReference = await writeMainDeclarationFile(references, config);
-  await writeTsConfigFile(mainReference, config);
-}
-async function writeImportsDeclarationFile(config) {
-  const filePath = (0, import_path10.resolve)(config.typesDir, "imports.d.ts");
-  const unimport2 = (0, import_unimport3.createUnimport)(getUnimportOptions(config));
-  await unimport2.scanImportsFromDir(void 0, { cwd: config.srcDir });
-  await import_fs_extra9.default.writeFile(
-    filePath,
-    ["// Generated by wxt", await unimport2.generateTypeDeclarations()].join(
-      "\n"
-    ) + "\n"
+// src/core/build.ts
+async function buildInternal(config) {
+  const verb = config.command === "serve" ? "Pre-rendering" : "Building";
+  const target = `${config.browser}-mv${config.manifestVersion}`;
+  config.logger.info(
+    `${verb} ${import_picocolors2.default.cyan(target)} for ${import_picocolors2.default.cyan(config.mode)} with ${import_picocolors2.default.green(
+      `Vite ${vite4.version}`
+    )}`
   );
-  return filePath;
-}
-async function writePathsDeclarationFile(entrypoints, config) {
-  const filePath = (0, import_path10.resolve)(config.typesDir, "paths.d.ts");
-  await import_fs_extra9.default.writeFile(
-    filePath,
-    [
-      "// Generated by wxt",
-      "type EntrypointPath =",
-      ...entrypoints.map((entry) => {
-        const path5 = getEntrypointBundlePath(
-          entry,
-          config.outDir,
-          entry.inputPath.endsWith(".html") ? ".html" : ".js"
-        );
-        return `  | "/${path5}"`;
-      }).sort()
-    ].join("\n") + "\n"
-  );
-  return filePath;
-}
-async function writeGlobalsDeclarationFile(config) {
-  const filePath = (0, import_path10.resolve)(config.typesDir, "globals.d.ts");
-  const globals = getGlobals(config);
-  await import_fs_extra9.default.writeFile(
-    filePath,
-    [
-      "// Generated by wxt",
-      "export {}",
-      "declare global {",
-      ...globals.map((global) => `  const ${global.name}: ${global.type};`),
-      "}"
-    ].join("\n") + "\n",
-    "utf-8"
-  );
-  return filePath;
-}
-async function writeMainDeclarationFile(references, config) {
-  const dir = config.wxtDir;
-  const filePath = (0, import_path10.resolve)(dir, "wxt.d.ts");
-  await import_fs_extra9.default.writeFile(
-    filePath,
-    [
-      "// Generated by wxt",
-      ...references.map(
-        (ref) => `/// <reference types="./${(0, import_path10.relative)(dir, ref)}" />`
-      )
-    ].join("\n") + "\n"
+  const startTime = Date.now();
+  await import_fs_extra11.default.rm(config.outDir, { recursive: true, force: true });
+  await import_fs_extra11.default.ensureDir(config.outDir);
+  const entrypoints = await findEntrypoints(config);
+  const groups = groupEntrypoints(entrypoints);
+  const { output } = await rebuild(config, groups);
+  config.logger.success(
+    `Built extension in ${formatDuration(Date.now() - startTime)}`
   );
-  return filePath;
+  await printBuildSummary(output, config);
+  return output;
 }
-async function writeTsConfigFile(mainReference, config) {
-  const dir = config.wxtDir;
-  await import_fs_extra9.default.writeFile(
-    (0, import_path10.resolve)(dir, "tsconfig.json"),
-    `{
-  "compilerOptions": {
-    "target": "ESNext",
-    "module": "ESNext",
-    "moduleResolution": "Bundler",
-    "noEmit": true,
-    "esModuleInterop": true,
-    "forceConsistentCasingInFileNames": true,
-    "resolveJsonModule": true,
-
-    /* Type Checking */
-    "strict": true,
-
-    /* Completeness */
-    "skipLibCheck": true
-  },
-  "include": [
-    "${(0, import_path10.relative)(dir, config.root)}/**/*",
-    "./${(0, import_path10.relative)(dir, mainReference)}"
-  ],
-  "exclude": ["${(0, import_path10.relative)(dir, config.outBaseDir)}"]
-}`
+async function rebuild(config, entrypointGroups, existingOutput = {
+  steps: [],
+  publicAssets: []
+}) {
+  const allEntrypoints = await findEntrypoints(config);
+  await generateTypesDir(allEntrypoints, config);
+  const newOutput = await buildEntrypoints(entrypointGroups, config);
+  const mergedOutput = {
+    steps: [...existingOutput.steps, ...newOutput.steps],
+    publicAssets: [...existingOutput.publicAssets, ...newOutput.publicAssets]
+  };
+  const newManifest = await generateMainfest(
+    allEntrypoints,
+    mergedOutput,
+    config
   );
+  const finalOutput = {
+    manifest: newManifest,
+    ...newOutput
+  };
+  await writeManifest(newManifest, finalOutput, config);
+  return {
+    output: {
+      manifest: newManifest,
+      steps: [...existingOutput.steps, ...finalOutput.steps],
+      publicAssets: [
+        ...existingOutput.publicAssets,
+        ...finalOutput.publicAssets
+      ]
+    },
+    manifest: newManifest
+  };
 }
 
-// src/index.ts
-var import_picocolors2 = __toESM(require("picocolors"), 1);
-var vite4 = __toESM(require("vite"), 1);
+// src/core/server.ts
+var vite5 = __toESM(require("vite"), 1);
 
 // src/core/utils/findOpenPort.ts
 var import_node_net = __toESM(require("net"), 1);
@@ -1358,17 +1575,6 @@ function findOpenPortRecursive(port, startPort, endPort) {
   });
 }
 
-// src/core/utils/formatDuration.ts
-function formatDuration(duration) {
-  if (duration < 1e3)
-    return `${duration} ms`;
-  if (duration < 1e4)
-    return `${(duration / 1e3).toFixed(3)} s`;
-  if (duration < 6e4)
-    return `${(duration / 1e3).toFixed(1)} s`;
-  return `${(duration / 1e3).toFixed(0)} s`;
-}
-
 // src/core/runners/createWebExtRunner.ts
 function createWebExtRunner() {
   let runner;
@@ -1426,120 +1632,93 @@ function createWebExtRunner() {
 var WARN_LOG_LEVEL = 40;
 var ERROR_LOG_LEVEL = 50;
 
-// src/core/utils/groupEntrypoints.ts
-function groupEntrypoints(entrypoints) {
-  const groupIndexMap = {};
-  const groups = [];
-  for (const entry of entrypoints) {
-    const group = ENTRY_TYPE_TO_GROUP_MAP[entry.type];
-    if (group === "no-group") {
-      groups.push(entry);
-    } else {
-      let groupIndex = groupIndexMap[group];
-      if (groupIndex == null) {
-        groupIndex = groups.push([]) - 1;
-        groupIndexMap[group] = groupIndex;
-      }
-      groups[groupIndex].push(entry);
+// src/core/server.ts
+async function getServerInfo() {
+  const port = await findOpenPort(3e3, 3010);
+  const hostname = "localhost";
+  const origin = `http://${hostname}:${port}`;
+  const serverConfig = {
+    server: {
+      origin
     }
-  }
-  return groups;
+  };
+  return {
+    port,
+    hostname,
+    origin,
+    viteServerConfig: serverConfig
+  };
 }
-var ENTRY_TYPE_TO_GROUP_MAP = {
-  sandbox: "sandbox-page",
-  popup: "extension-page",
-  newtab: "extension-page",
-  history: "extension-page",
-  options: "extension-page",
-  devtools: "extension-page",
-  bookmarks: "extension-page",
-  sidepanel: "extension-page",
-  "unlisted-page": "extension-page",
-  background: "no-group",
-  "content-script": "no-group",
-  "unlisted-script": "no-group"
-};
-
-// src/core/utils/detectDevChanges.ts
-function detectDevChanges(changedFiles, currentOutput) {
-  if (currentOutput == null)
-    return { type: "no-change" };
-  const changedSteps = new Set(
-    changedFiles.flatMap(
-      (changedFile) => findEffectedSteps(changedFile, currentOutput)
-    )
+async function setupServer(serverInfo, config) {
+  const runner = createWebExtRunner();
+  const viteServer = await vite5.createServer(
+    vite5.mergeConfig(serverInfo, config.vite)
   );
-  if (changedSteps.size === 0)
-    return { type: "no-change" };
-  const unchangedOutput = {
-    manifest: currentOutput.manifest,
-    steps: [],
-    publicAssets: []
+  const start = async () => {
+    await viteServer.listen(server.port);
+    config.logger.success(`Started dev server @ ${serverInfo.origin}`);
+    server.currentOutput = await buildInternal(config);
+    config.logger.info("Opening browser...");
+    await runner.openBrowser(config);
+    config.logger.success("Opened!");
   };
-  const changedOutput = {
-    manifest: currentOutput.manifest,
-    steps: [],
-    publicAssets: []
+  const reloadExtension = () => {
+    viteServer.ws.send("wxt:reload-extension");
   };
-  for (const step of currentOutput.steps) {
-    if (changedSteps.has(step)) {
-      changedOutput.steps.push(step);
-    } else {
-      unchangedOutput.steps.push(step);
-    }
-  }
-  for (const asset of currentOutput.publicAssets) {
-    if (changedSteps.has(asset)) {
-      changedOutput.publicAssets.push(asset);
-    } else {
-      unchangedOutput.publicAssets.push(asset);
-    }
-  }
-  const isOnlyHtmlChanges = !changedFiles.find(
-    ([_, file]) => !file.endsWith(".html")
-  );
-  if (isOnlyHtmlChanges) {
-    return {
-      type: "html-reload",
-      cachedOutput: unchangedOutput,
-      rebuildGroups: changedOutput.steps.map((step) => step.entrypoints)
-    };
-  }
-  return {
-    type: "extension-reload",
-    cachedOutput: unchangedOutput,
-    rebuildGroups: changedOutput.steps.map((step) => step.entrypoints)
+  const reloadPage = (path5) => {
+    viteServer.ws.send("wxt:reload-page", path5);
+  };
+  const reloadContentScript = (contentScript) => {
+    viteServer.ws.send("wxt:reload-content-script", contentScript);
+  };
+  const server = {
+    ...viteServer,
+    start,
+    currentOutput: {
+      manifest: {
+        manifest_version: 3,
+        name: "",
+        version: ""
+      },
+      publicAssets: [],
+      steps: []
+    },
+    port: serverInfo.port,
+    hostname: serverInfo.hostname,
+    origin: serverInfo.origin,
+    reloadExtension,
+    reloadPage,
+    reloadContentScript
   };
+  return server;
 }
-function findEffectedSteps(changedFile, currentOutput) {
-  const changes = [];
-  const changedPath = changedFile[1];
-  const isChunkEffected = (chunk) => (
-    // If it's an HTML file with the same path, is is effected because HTML files need to be pre-rendered
-    // TODO: use bundle path to support `<name>/index.html`?
-    chunk.type === "asset" && changedPath.endsWith(chunk.fileName) || // If it's a chunk that depends on the changed file, it is effected
-    chunk.type === "chunk" && chunk.moduleIds.includes(changedPath)
-  );
-  for (const step of currentOutput.steps) {
-    const effectedChunk = step.chunks.find((chunk) => isChunkEffected(chunk));
-    if (effectedChunk)
-      changes.push(step);
+function reloadContentScripts(steps, config, server) {
+  if (config.manifestVersion === 3) {
+    steps.forEach((step) => {
+      const entry = step.entrypoints;
+      if (Array.isArray(entry) || entry.type !== "content-script")
+        return;
+      const js = [getEntrypointBundlePath(entry, config.outDir, ".js")];
+      const css = getContentScriptCssFiles([entry], server.currentOutput);
+      server.reloadContentScript({
+        js,
+        css,
+        ...entry.options
+      });
+    });
+  } else {
+    server.reloadExtension();
   }
-  const effectedAsset = currentOutput.publicAssets.find(
-    (chunk) => isChunkEffected(chunk)
-  );
-  if (effectedAsset)
-    changes.push(effectedAsset);
-  return changes;
 }
-
-// src/index.ts
-var import_async_mutex = require("async-mutex");
-var import_consola3 = require("consola");
-var import_node_path4 = require("path");
+function reloadHtmlPages(groups, server, config) {
+  groups.flat().forEach((entry) => {
+    const path5 = getEntrypointBundlePath(entry, config.outDir, ".html");
+    server.reloadPage(path5);
+  });
+}
 
 // package.json
-var version = "0.0.2";
+var version2 = "0.1.1-alpha1";
 
 // src/core/utils/defineConfig.ts
 function defineConfig(config) {
@@ -1557,45 +1736,40 @@ async function build2(config) {
   return await buildInternal(internalConfig);
 }
 async function createServer2(config) {
-  const port = await findOpenPort(3e3, 3010);
-  const hostname = "localhost";
-  const origin = `http://${hostname}:${port}`;
-  const serverConfig = {
-    server: {
-      origin
-    }
+  const serverInfo = await getServerInfo();
+  const getLatestInternalConfig = () => {
+    const viteConfig = vite6.mergeConfig(
+      serverInfo.viteServerConfig,
+      config?.vite ?? {}
+    );
+    return getInternalConfig({ ...config, vite: viteConfig }, "serve");
   };
-  let internalConfig = await getInternalConfig(
-    vite4.mergeConfig(serverConfig, config ?? {}),
-    "serve"
-  );
-  const runner = createWebExtRunner();
-  let hasBuiltOnce = false;
-  let currentOutput;
+  let internalConfig = await getLatestInternalConfig();
+  const server = await setupServer(serverInfo, internalConfig);
+  internalConfig.server = server;
   const fileChangedMutex = new import_async_mutex.Mutex();
   const changeQueue = [];
-  const viteServer = await vite4.createServer(internalConfig.vite);
-  viteServer.watcher.on("all", async (event, path5, stats) => {
-    if (!hasBuiltOnce || path5.startsWith(internalConfig.outBaseDir))
+  server.ws.on("wxt:background-initialized", () => {
+    reloadContentScripts(server.currentOutput.steps, internalConfig, server);
+  });
+  server.watcher.on("all", async (event, path5, _stats) => {
+    if (path5.startsWith(internalConfig.outBaseDir))
       return;
     changeQueue.push([event, path5]);
     await fileChangedMutex.runExclusive(async () => {
       const fileChanges = changeQueue.splice(0, changeQueue.length);
-      const changes = detectDevChanges(fileChanges, currentOutput);
+      const changes = detectDevChanges(fileChanges, server.currentOutput);
       if (changes.type === "no-change")
         return;
       import_consola3.consola.info(
-        `Changed: ${Array.from(new Set(fileChanges.map((change) => change[1]))).map((file) => import_picocolors2.default.dim((0, import_node_path4.relative)(internalConfig.root, file))).join(", ")}`
+        `Changed: ${Array.from(new Set(fileChanges.map((change) => change[1]))).map((file) => import_picocolors3.default.dim((0, import_node_path4.relative)(internalConfig.root, file))).join(", ")}`
       );
       const rebuiltNames = changes.rebuildGroups.flat().map((entry) => {
-        return import_picocolors2.default.cyan(
+        return import_picocolors3.default.cyan(
           (0, import_node_path4.relative)(internalConfig.outDir, getEntrypointOutputFile(entry, ""))
         );
-      }).join(import_picocolors2.default.dim(", "));
-      internalConfig = await getInternalConfig(
-        vite4.mergeConfig(serverConfig, config ?? {}),
-        "serve"
-      );
+      }).join(import_picocolors3.default.dim(", "));
+      internalConfig = await getLatestInternalConfig();
       internalConfig.server = server;
       const { output: newOutput } = await rebuild(
         internalConfig,
@@ -1603,103 +1777,29 @@ async function createServer2(config) {
         changes.rebuildGroups,
         changes.cachedOutput
       );
-      currentOutput = newOutput;
+      server.currentOutput = newOutput;
       switch (changes.type) {
         case "extension-reload":
           server.reloadExtension();
-          import_consola3.consola.success(`Reloaded extension: ${rebuiltNames}`);
           break;
         case "html-reload":
-          changes.rebuildGroups.flat().forEach((entry) => {
-            const path6 = getEntrypointBundlePath(
-              entry,
-              internalConfig.outDir,
-              ".html"
-            );
-            server.reloadPage(path6);
-          });
-          import_consola3.consola.success(`Reloaded pages: ${rebuiltNames}`);
+          reloadHtmlPages(changes.rebuildGroups, server, internalConfig);
+          break;
+        case "content-script-reload":
+          reloadContentScripts(changes.changedSteps, internalConfig, server);
           break;
       }
+      import_consola3.consola.success(`Reloaded: ${rebuiltNames}`);
     });
   });
-  const server = {
-    ...viteServer,
-    async listen(port2, isRestart) {
-      const res = await viteServer.listen(port2, isRestart);
-      if (!isRestart) {
-        internalConfig.logger.success(`Started dev server @ ${origin}`);
-        internalConfig.logger.info("Opening browser...");
-        await runner.openBrowser(internalConfig);
-        internalConfig.logger.success("Opened!");
-      }
-      return res;
-    },
-    port,
-    hostname,
-    origin,
-    reloadExtension: () => {
-      server.ws.send("wxt:reload-extension");
-    },
-    reloadPage: (path5) => {
-      server.ws.send("wxt:reload-page", path5);
-    }
-  };
-  internalConfig.logger.info("Created dev server");
-  internalConfig.server = server;
-  currentOutput = await buildInternal(internalConfig);
-  hasBuiltOnce = true;
   return server;
 }
-async function buildInternal(config) {
-  const verb = config.command === "serve" ? "Pre-rendering" : "Building";
-  const target = `${config.browser}-mv${config.manifestVersion}`;
-  config.logger.info(
-    `${verb} ${import_picocolors2.default.cyan(target)} for ${import_picocolors2.default.cyan(config.mode)} with ${import_picocolors2.default.green(
-      `Vite ${vite4.version}`
-    )}`
-  );
-  const startTime = Date.now();
-  await import_fs_extra10.default.rm(config.outDir, { recursive: true, force: true });
-  await import_fs_extra10.default.ensureDir(config.outDir);
-  const entrypoints = await findEntrypoints(config);
-  const groups = groupEntrypoints(entrypoints);
-  const { output } = await rebuild(config, groups);
-  config.logger.success(
-    `Built extension in ${formatDuration(Date.now() - startTime)}`
-  );
-  await printBuildSummary(output, config);
-  return output;
-}
-async function rebuild(config, entrypointGroups, existingOutput = {
-  steps: [],
-  publicAssets: []
-}) {
-  const allEntrypoints = await findEntrypoints(config);
-  await generateTypesDir(allEntrypoints, config);
-  const buildOutput = await buildEntrypoints(entrypointGroups, config);
-  const manifest = await generateMainfest(allEntrypoints, buildOutput, config);
-  const output = {
-    manifest,
-    ...buildOutput
-  };
-  await writeManifest(manifest, output, config);
-  return {
-    output: {
-      manifest,
-      steps: [...existingOutput.steps, ...output.steps],
-      publicAssets: [...existingOutput.publicAssets, ...output.publicAssets]
-    },
-    manifest
-  };
-}
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
   build,
   createServer,
   defineConfig,
   defineRunnerConfig,
-  rebuild,
   version
 });
 //# sourceMappingURL=index.cjs.map