@crxjs/vite-plugin 2.4.0 → 2.6.0

package/dist/index.mjs

@@ -9,12 +9,12 @@ import { rollup } from 'rollup';
 import * as lexer from 'es-module-lexer';
 import { readFile as readFile$1 } from 'fs/promises';
 import MagicString from 'magic-string';
+import { build, mergeConfig, createLogger, version } from 'vite';
 import convertSourceMap from 'convert-source-map';
 import pc from 'picocolors';
-import { createLogger, version } from 'vite';
 import { readFileSync, existsSync, promises } from 'fs';
 import { createRequire } from 'module';
-import fg from 'fast-glob';
+import { glob, isDynamicPattern } from 'tinyglobby';
 import { parse } from 'node-html-parser';
 import jsesc from 'jsesc';
 
@@ -58,7 +58,7 @@ function isCrxPlugin(p) {
   return !!p && typeof p === "object" && !(p instanceof Promise) && !Array.isArray(p) && p.name.startsWith("crx:");
 }
 
-var workerHmrClient = "const ownOrigin = `chrome-extension://${chrome.runtime.id}`;\nself.addEventListener(\"fetch\", (fetchEvent) => {\n  const url = new URL(fetchEvent.request.url);\n  if (url.origin === ownOrigin) {\n    fetchEvent.respondWith(sendToServer(fetchEvent.request));\n  }\n});\nasync function sendToServer(req) {\n  const url = new URL(req.url);\n  const requestHeaders = new Headers(req.headers);\n  url.protocol = __SERVER_PROTO__ + \":\";\n  url.host = \"localhost\";\n  url.port = __SERVER_PORT__;\n  url.searchParams.set(\"t\", Date.now().toString());\n  const response = await fetch(url.href.replace(/=$|=(?=&)/g, \"\"), {\n    headers: requestHeaders\n  });\n  const responseHeaders = new Headers(response.headers);\n  responseHeaders.set(\n    \"Content-Type\",\n    responseHeaders.get(\"Content-Type\") ?? \"text/javascript\"\n  );\n  responseHeaders.set(\n    \"Cache-Control\",\n    responseHeaders.get(\"Cache-Control\") ?? \"\"\n  );\n  return new Response(response.body, {\n    headers: responseHeaders\n  });\n}\nconst ports = /* @__PURE__ */ new Set();\nchrome.runtime.onConnect.addListener((port) => {\n  if (port.name === \"@crx/client\") {\n    ports.add(port);\n    port.onDisconnect.addListener((port2) => {\n      if (chrome.runtime.lastError) {\n        console.error(chrome.runtime.lastError);\n      }\n      ports.delete(port2);\n    });\n    port.onMessage.addListener((message) => {\n    });\n    port.postMessage({ data: JSON.stringify({ type: \"connected\" }) });\n  }\n});\nfunction notifyContentScripts(payload) {\n  const data = JSON.stringify(payload);\n  for (const port of ports)\n    port.postMessage({ data });\n}\nconsole.log(\"[vite] connecting...\");\nconst socketProtocol = __HMR_PROTOCOL__ || (location.protocol === \"https:\" ? \"wss\" : \"ws\");\nconst socketToken = __HMR_TOKEN__;\nconst socketHost = `${__HMR_HOSTNAME__ || location.hostname}:${__HMR_PORT__}`;\nconst socket = new WebSocket(\n  `${socketProtocol}://${socketHost}?token=${socketToken}`,\n  \"vite-hmr\"\n);\nconst base = __BASE__ || \"/\";\nsocket.addEventListener(\"message\", async ({ data }) => {\n  handleSocketMessage(JSON.parse(data));\n});\nfunction isCrxHmrPayload(x) {\n  return x.type === \"custom\" && x.event.startsWith(\"crx:\");\n}\nfunction handleSocketMessage(payload) {\n  if (isCrxHmrPayload(payload)) {\n    handleCrxHmrPayload(payload);\n  } else if (payload.type === \"connected\") {\n    console.log(`[vite] connected.`);\n    const interval = setInterval(() => socket.send(\"ping\"), __HMR_TIMEOUT__);\n    socket.addEventListener(\"close\", () => clearInterval(interval));\n  }\n}\nfunction handleCrxHmrPayload(payload) {\n  notifyContentScripts(payload);\n  switch (payload.event) {\n    case \"crx:runtime-reload\":\n      console.log(\"[crx] runtime reload\");\n      chrome.runtime.reload();\n      break;\n  }\n}\nasync function waitForSuccessfulPing(ms = 1e3) {\n  while (true) {\n    try {\n      await fetch(`${base}__vite_ping`);\n      break;\n    } catch (e) {\n      await new Promise((resolve) => setTimeout(resolve, ms));\n    }\n  }\n}\nsocket.addEventListener(\"close\", async ({ wasClean }) => {\n  if (wasClean)\n    return;\n  console.log(`[vite] server connection lost. polling for restart...`);\n  await waitForSuccessfulPing();\n  handleCrxHmrPayload({\n    type: \"custom\",\n    event: \"crx:runtime-reload\"\n  });\n});\n";
+var workerHmrClient = "const ownOrigin = `chrome-extension://${chrome.runtime.id}`;\nself.addEventListener(\"fetch\", (fetchEvent) => {\n  const url = new URL(fetchEvent.request.url);\n  if (url.origin === ownOrigin) {\n    fetchEvent.respondWith(sendToServer(fetchEvent.request));\n  }\n});\nasync function sendToServer(req) {\n  const url = new URL(req.url);\n  const requestHeaders = new Headers(req.headers);\n  url.protocol = __SERVER_PROTO__ + \":\";\n  url.host = \"localhost\";\n  url.port = __SERVER_PORT__;\n  url.searchParams.set(\"t\", Date.now().toString());\n  const response = await fetch(url.href.replace(/=$|=(?=&)/g, \"\"), {\n    headers: requestHeaders\n  });\n  const responseHeaders = new Headers(response.headers);\n  responseHeaders.set(\n    \"Content-Type\",\n    responseHeaders.get(\"Content-Type\") ?? \"text/javascript\"\n  );\n  responseHeaders.set(\n    \"Cache-Control\",\n    responseHeaders.get(\"Cache-Control\") ?? \"\"\n  );\n  return new Response(response.body, {\n    headers: responseHeaders\n  });\n}\nconst ports = /* @__PURE__ */ new Set();\nchrome.runtime.onConnect.addListener((port) => {\n  if (port.name === \"@crx/client\") {\n    ports.add(port);\n    port.onDisconnect.addListener((port2) => {\n      if (chrome.runtime.lastError) {\n        console.error(chrome.runtime.lastError);\n      }\n      ports.delete(port2);\n    });\n    port.onMessage.addListener((message) => {\n    });\n    port.postMessage({ data: JSON.stringify({ type: \"connected\" }) });\n  }\n});\nfunction notifyContentScripts(payload) {\n  const data = JSON.stringify(payload);\n  for (const port of ports)\n    port.postMessage({ data });\n}\nconsole.log(\"[vite] connecting...\");\nconst socketProtocol = __HMR_PROTOCOL__ || (location.protocol === \"https:\" ? \"wss\" : \"ws\");\nconst socketToken = __HMR_TOKEN__;\nconst socketHost = `${__HMR_HOSTNAME__ || location.hostname}:${__HMR_PORT__}`;\nconst socket = new WebSocket(\n  `${socketProtocol}://${socketHost}?token=${socketToken}`,\n  \"vite-hmr\"\n);\nconst base = __BASE__ || \"/\";\nsocket.addEventListener(\"message\", async ({ data }) => {\n  handleSocketMessage(JSON.parse(data));\n});\nfunction isCrxHmrPayload(x) {\n  return x.type === \"custom\" && x.event.startsWith(\"crx:\");\n}\nfunction handleSocketMessage(payload) {\n  if (isCrxHmrPayload(payload)) {\n    handleCrxHmrPayload(payload);\n  } else if (payload.type === \"connected\") {\n    console.log(`[vite] connected.`);\n    const interval = setInterval(() => socket.send(\"ping\"), __HMR_TIMEOUT__);\n    socket.addEventListener(\"close\", () => clearInterval(interval));\n  }\n}\nfunction handleCrxHmrPayload(payload) {\n  if (!__LIVE_RELOAD__) {\n    if (payload.event === \"crx:runtime-reload\") {\n      console.log(\"[crx] runtime reload suppressed (liveReload disabled)\");\n    }\n    return;\n  }\n  notifyContentScripts(payload);\n  switch (payload.event) {\n    case \"crx:runtime-reload\":\n      console.log(\"[crx] runtime reload\");\n      chrome.runtime.reload();\n      break;\n  }\n}\nasync function waitForSuccessfulPing(ms = 1e3) {\n  while (true) {\n    try {\n      await fetch(`${base}__vite_ping`);\n      break;\n    } catch (e) {\n      await new Promise((resolve) => setTimeout(resolve, ms));\n    }\n  }\n}\nsocket.addEventListener(\"close\", async ({ wasClean }) => {\n  if (wasClean)\n    return;\n  console.log(`[vite] server connection lost. polling for restart...`);\n  await waitForSuccessfulPing();\n  if (__LIVE_RELOAD__) {\n    handleCrxHmrPayload({\n      type: \"custom\",\n      event: \"crx:runtime-reload\"\n    });\n  } else {\n    console.log(\n      \"[crx] server reconnected, skipping reload (liveReload disabled)\"\n    );\n  }\n});\n";
 
 const _debug = (id) => debug$5("crx").extend(id);
 const hash = (data, length = 5) => createHash("sha1").update(data).digest("base64").replace(/[^A-Za-z0-9]/g, "").slice(0, length);
@@ -209,7 +209,7 @@ function formatFileData(script) {
   return script;
 }
 function getFileName({ type, id }) {
-  let fileName = id.replace(/t=\d+&/, "").replace(/\?t=\d+$/, "").replace(/^\//, "").replace(/\?/g, "__").replace(/&/g, "_").replace(/=/g, "--");
+  let fileName = id.replace(/t=\d+&/, "").replace(/\?t=\d+$/, "").replace(/^\//, "").replace(/\?/g, "__").replace(/&/g, "_").replace(/=/g, "--").replace(/:/g, "-");
   if (fileName.includes("node_modules/")) {
     fileName = `vendor/${fileName.split("node_modules/").pop().replace(/\//g, "-")}`;
   } else if (fileName.startsWith("@")) {
@@ -244,11 +244,17 @@ function getOutputPath(server, fileName) {
   const target = isAbsolute(outDir) ? join(outDir, fileName) : join(root, outDir, fileName);
   return target;
 }
-function getViteUrl({ type, id }) {
+function getViteUrl({ type, id }, { timestamp = false } = {}) {
+  if (timestamp && !id.startsWith("/@") && !id.includes("?v=")) {
+    const t = `t=${Date.now()}` + (id.includes("?") ? "&" : "");
+    const parts = id.split("?");
+    parts[1] = typeof parts[1] === "undefined" ? t : t + parts[1];
+    id = parts.join("?");
+  }
   if (type === "asset") {
     throw new Error(`File type "${type}" not implemented.`);
   } else if (type === "iife") {
-    throw new Error(`File type "${type}" not implemented.`);
+    throw new Error(`File type "iife" is handled via dedicated IIFE bundler, not Vite transform.`);
   } else if (type === "loader") {
     throw new Error("Vite does not transform loader files.");
   } else if (type === "module") {
@@ -293,6 +299,7 @@ function getContentCssIndex(id) {
 const pluginBackground = () => {
   let config;
   let browser;
+  let liveReload = true;
   return [
     {
       name: "crx:background-client",
@@ -305,7 +312,7 @@ const pluginBackground = () => {
         if (id === workerClientId) {
           const base = `${config.server.https ? "https" : "http"}://localhost:${config.server.port}/`;
           return defineClientValues(
-            workerHmrClient.replace("__BASE__", JSON.stringify(base)),
+            workerHmrClient.replace("__BASE__", JSON.stringify(base)).replace("__LIVE_RELOAD__", JSON.stringify(liveReload)),
             config
           );
         }
@@ -318,6 +325,7 @@ const pluginBackground = () => {
       async config(config2) {
         const opts = await getOptions(config2);
         browser = opts.browser || "chrome";
+        liveReload = opts.liveReload !== false;
       },
       configResolved(_config) {
         config = _config;
@@ -376,7 +384,53 @@ const pluginBackground = () => {
   ];
 };
 
-var contentHmrPort = "function isCrxHMRPayload(x) {\n  return x.type === \"custom\" && x.event.startsWith(\"crx:\");\n}\nclass HMRPort {\n  port;\n  callbacks = /* @__PURE__ */ new Map();\n  constructor() {\n    setInterval(() => {\n      try {\n        this.port?.postMessage({ data: \"ping\" });\n      } catch (error) {\n        if (error instanceof Error && error.message.includes(\"Extension context invalidated.\")) {\n          location.reload();\n        } else\n          throw error;\n      }\n    }, __CRX_HMR_TIMEOUT__);\n    setInterval(this.initPort, 5 * 60 * 1e3);\n    this.initPort();\n  }\n  initPort = () => {\n    this.port?.disconnect();\n    this.port = chrome.runtime.connect({ name: \"@crx/client\" });\n    this.port.onDisconnect.addListener(this.handleDisconnect.bind(this));\n    this.port.onMessage.addListener(this.handleMessage.bind(this));\n    this.port.postMessage({ type: \"connected\" });\n  };\n  handleDisconnect = () => {\n    if (this.callbacks.has(\"close\"))\n      for (const cb of this.callbacks.get(\"close\")) {\n        cb({ wasClean: true });\n      }\n  };\n  handleMessage = (message) => {\n    const forward = (data) => {\n      if (this.callbacks.has(\"message\"))\n        for (const cb of this.callbacks.get(\"message\")) {\n          cb({ data });\n        }\n    };\n    const payload = JSON.parse(message.data);\n    if (isCrxHMRPayload(payload)) {\n      if (payload.event === \"crx:runtime-reload\") {\n        console.log(\"[crx] runtime reload\");\n        setTimeout(() => location.reload(), 500);\n      } else {\n        forward(JSON.stringify(payload.data));\n      }\n    } else {\n      forward(message.data);\n    }\n  };\n  addEventListener = (event, callback) => {\n    const cbs = this.callbacks.get(event) ?? /* @__PURE__ */ new Set();\n    cbs.add(callback);\n    this.callbacks.set(event, cbs);\n  };\n  send = (data) => {\n    if (this.port)\n      this.port.postMessage({ data });\n    else\n      throw new Error(\"HMRPort is not initialized\");\n  };\n}\n\nexport { HMRPort };\n";
+const extensionOrigins = [/^chrome-extension:\/\//, /^moz-extension:\/\//];
+function isExtensionOrigin(origin) {
+  return origin ? extensionOrigins.some((pattern) => pattern.test(origin)) : false;
+}
+function addExtensionOrigins(origin) {
+  if (origin === true)
+    return true;
+  if (typeof origin === "function") {
+    return (requestOrigin, cb) => {
+      if (isExtensionOrigin(requestOrigin)) {
+        cb(null, true);
+        return;
+      }
+      origin(requestOrigin, cb);
+    };
+  }
+  if (Array.isArray(origin))
+    return [...origin, ...extensionOrigins];
+  if (origin)
+    return [origin, ...extensionOrigins];
+  return extensionOrigins;
+}
+function addExtensionCors(cors) {
+  if (cors === true)
+    return true;
+  if (cors && typeof cors === "object") {
+    return {
+      ...cors,
+      origin: addExtensionOrigins(cors.origin)
+    };
+  }
+  return { origin: extensionOrigins };
+}
+function pluginExtensionCors() {
+  return {
+    name: "crx:extension-cors",
+    apply: "serve",
+    config(config) {
+      config.server = {
+        ...config.server,
+        cors: addExtensionCors(config.server?.cors)
+      };
+    }
+  };
+}
+
+var contentHmrPort = "function isCrxHMRPayload(x) {\n  return x.type === \"custom\" && x.event.startsWith(\"crx:\");\n}\nclass HMRPort {\n  port;\n  callbacks = /* @__PURE__ */ new Map();\n  constructor() {\n    setInterval(() => {\n      try {\n        this.port?.postMessage({ data: \"ping\" });\n      } catch (error) {\n        if (error instanceof Error && error.message.includes(\"Extension context invalidated.\")) {\n          location.reload();\n        } else\n          throw error;\n      }\n    }, __CRX_HMR_TIMEOUT__);\n    setInterval(this.initPort, 5 * 60 * 1e3);\n    this.initPort();\n  }\n  initPort = () => {\n    this.port?.disconnect();\n    this.port = chrome.runtime.connect({ name: \"@crx/client\" });\n    this.port.onDisconnect.addListener(this.handleDisconnect.bind(this));\n    this.port.onMessage.addListener(this.handleMessage.bind(this));\n    this.port.postMessage({ type: \"connected\" });\n  };\n  handleDisconnect = () => {\n    if (this.callbacks.has(\"close\"))\n      for (const cb of this.callbacks.get(\"close\")) {\n        cb({ wasClean: true });\n      }\n  };\n  handleMessage = (message) => {\n    const forward = (data) => {\n      if (this.callbacks.has(\"message\"))\n        for (const cb of this.callbacks.get(\"message\")) {\n          cb({ data });\n        }\n    };\n    const payload = JSON.parse(message.data);\n    if (isCrxHMRPayload(payload)) {\n      if (payload.event === \"crx:runtime-reload\") {\n        if (__CRX_LIVE_RELOAD__) {\n          console.log(\"[crx] runtime reload\");\n          setTimeout(() => location.reload(), 500);\n        } else {\n          console.log(\"[crx] runtime reload suppressed (liveReload disabled)\");\n        }\n      } else {\n        forward(JSON.stringify(payload.data));\n      }\n    } else {\n      forward(message.data);\n    }\n  };\n  addEventListener = (event, callback) => {\n    const cbs = this.callbacks.get(event) ?? /* @__PURE__ */ new Set();\n    cbs.add(callback);\n    this.callbacks.set(event, cbs);\n  };\n  send = (data) => {\n    if (this.port)\n      this.port.postMessage({ data });\n    else\n      throw new Error(\"HMRPort is not initialized\");\n  };\n}\n\nexport { HMRPort };\n";
 
 var contentDevLoader = "(function () {\n  'use strict';\n\n  const injectTime = performance.now();\n  (async () => {\n    if (__PREAMBLE__)\n      await import(\n        /* @vite-ignore */\n        chrome.runtime.getURL(__PREAMBLE__)\n      );\n    await import(\n      /* @vite-ignore */\n      chrome.runtime.getURL(__CLIENT__)\n    );\n    const { onExecute } = await import(\n      /* @vite-ignore */\n      chrome.runtime.getURL(__SCRIPT__)\n    );\n    onExecute?.({ perf: { injectTime, loadTime: performance.now() - injectTime } });\n  })().catch(console.error);\n\n})();\n";
 
@@ -396,9 +450,10 @@ contentScripts.change$.pipe(filter(RxMap.isChangeType.set)).subscribe(({ map, va
     "resolvedId",
     "scriptId"
   ];
-  for (const keyName of keyNames) {
-    const key = value[keyName];
-    if (typeof key === "undefined" || map.has(key)) {
+  const keys = keyNames.map((keyName) => value[keyName]);
+  keys.push(value.id.replace(/^\//, ""));
+  for (const key of keys) {
+    if (typeof key === "undefined" || map.get(key) === value) {
       continue;
     } else {
       map.set(key, value);
@@ -427,6 +482,21 @@ function createProMainLoader({ fileName }) {
   return contentProMainLoader.replace(/__SCRIPT__/g, JSON.stringify(fileName));
 }
 
+const { outputFile: outputFile$1 } = fsx;
+const getIifeGlobalName = (fileName) => {
+  const base = fileName.split("/").pop() ?? fileName;
+  const sanitized = base.replace(/\W+/g, "_").replace(/^_+/, "");
+  return `crx_${sanitized || "content_script"}`;
+};
+const resolveScriptInput = (server, id) => {
+  if (id.startsWith("/@fs/"))
+    return id.slice("/@fs/".length);
+  if (id.startsWith("/"))
+    return join(server.config.root, id.slice(1));
+  return id;
+};
+const isOutputChunk = (item) => item.type === "chunk";
+const isOutputAsset = (item) => item.type === "asset";
 const serverEvent$ = new ReplaySubject(1);
 const close$ = serverEvent$.pipe(
   filter((e) => e.type === "close"),
@@ -448,8 +518,17 @@ fileWriterEvent$.pipe(
 const allFilesReady$ = buildEnd$.pipe(
   switchMap(() => outputFiles.change$.pipe(startWith({ type: "start" }))),
   map(() => [...outputFiles.values()]),
-  switchMap((files) => Promise.allSettled(files.map(({ file }) => file)))
+  switchMap(
+    (files) => Promise.allSettled(files.map((file) => waitForOutputFile(file)))
+  )
 );
+async function waitForOutputFile(file, seen = /* @__PURE__ */ new Set()) {
+  if (seen.has(file))
+    return;
+  seen.add(file);
+  const { deps } = await file.file;
+  await Promise.all(deps.map((dep) => waitForOutputFile(dep, seen)));
+}
 const timestamp$ = new BehaviorSubject(Date.now());
 allFilesReady$.subscribe(() => {
   timestamp$.next(Date.now());
@@ -486,11 +565,20 @@ function prepAsset(fileName, { id, source }) {
   );
 }
 function prepScript(fileName, script) {
+  if (script.type === "iife")
+    return prepIifeScript(fileName, script);
   return ($) => $.pipe(
     // get script contents from dev server
     mergeMap(async ({ server }) => {
       const target = getOutputPath(server, fileName);
-      const viteUrl = getViteUrl(script);
+      const originalViteUrl = getViteUrl(script);
+      const isVueSfcQuery = script.id.includes("?vue");
+      const viteUrl = getViteUrl(script, { timestamp: isVueSfcQuery });
+      if (isVueSfcQuery) {
+        const module = await server.moduleGraph.getModuleByUrl(originalViteUrl);
+        if (module)
+          server.moduleGraph.invalidateModule(module);
+      }
       const transformResult = await server.transformRequest(viteUrl);
       if (!transformResult)
         throw new TypeError(`Unable to load "${script.id}" from server.`);
@@ -543,12 +631,116 @@ ${sourceMap}
     })
   );
 }
+async function bundleIife(server, script, fileName) {
+  const input = resolveScriptInput(server, script.id);
+  const sourcemap = server.config.build.sourcemap === "inline" ? "inline" : false;
+  const result = await build({
+    root: server.config.root,
+    mode: server.config.mode,
+    configFile: false,
+    // Don't load user's config - use minimal IIFE-specific settings
+    logLevel: "silent",
+    resolve: {
+      // Copy resolve settings from the dev server for consistency
+      alias: server.config.resolve.alias,
+      extensions: server.config.resolve.extensions,
+      conditions: server.config.resolve.conditions
+    },
+    build: {
+      write: false,
+      // Don't write to disk, we'll handle that
+      manifest: false,
+      // Don't generate Vite manifest
+      rollupOptions: {
+        input,
+        output: {
+          format: "iife",
+          name: getIifeGlobalName(fileName),
+          entryFileNames: fileName,
+          inlineDynamicImports: true,
+          // Required for IIFE format
+          sourcemap
+        }
+      },
+      minify: false,
+      copyPublicDir: false
+    }
+  });
+  const outputs = Array.isArray(result) ? result : [result];
+  const firstOutput = outputs[0];
+  const output = "output" in firstOutput ? firstOutput.output : void 0;
+  if (!output) {
+    throw new Error(`Unable to generate IIFE bundle for "${script.id}"`);
+  }
+  const entryChunk = output.find(
+    (item) => isOutputChunk(item) && item.isEntry
+  );
+  if (!entryChunk) {
+    throw new Error(`Unable to generate IIFE bundle for "${script.id}"`);
+  }
+  const assets = output.filter(isOutputAsset).filter(
+    // Filter out manifest.json to avoid overwriting extension manifest
+    (asset) => asset.fileName !== "manifest.json" && !asset.fileName.startsWith(".vite/")
+  );
+  const extraChunks = output.filter(
+    (item) => isOutputChunk(item) && !item.isEntry
+  );
+  return {
+    code: entryChunk.code,
+    assets,
+    extraChunks
+  };
+}
+function prepIifeScript(fileName, script) {
+  return ($) => $.pipe(
+    mergeMap(async ({ server }) => {
+      const target = getOutputPath(server, fileName);
+      const { code, assets, extraChunks } = await bundleIife(
+        server,
+        script,
+        fileName
+      );
+      return { target, source: code, deps: [], server, assets, extraChunks };
+    }),
+    mergeMap(
+      async ({ target, source, deps, server, assets, extraChunks }) => {
+        const extras = [
+          ...assets.map((asset) => ({
+            fileName: asset.fileName,
+            source: asset.source
+          })),
+          ...extraChunks.map((chunk) => ({
+            fileName: chunk.fileName,
+            source: chunk.code
+          }))
+        ].filter((item) => item.fileName !== fileName);
+        await Promise.all(
+          extras.map(async (item) => {
+            const outputPath = getOutputPath(server, item.fileName);
+            if (typeof item.source === "undefined" || item.source === null)
+              return;
+            if (item.source instanceof Uint8Array)
+              await outputFile$1(outputPath, item.source);
+            else
+              await outputFile$1(outputPath, item.source, { encoding: "utf8" });
+          })
+        );
+        return { target, source, deps };
+      }
+    )
+  );
+}
 async function allFilesReady() {
   await firstValueFrom(allFilesReady$);
 }
 
 const { outputFile } = fsx;
 const debug$4 = _debug("file-writer");
+function queueWrite(script, previous) {
+  if (!previous)
+    return write(script);
+  return previous.file.catch(() => void 0).then(() => write(script));
+}
 async function start({
   server
 }) {
@@ -590,18 +782,24 @@ function add(script) {
     file = formatFileData({
       ...script,
       fileName,
-      file: write(script)
+      file: queueWrite(script)
     });
     outputFiles.set(file.fileName, file);
     debug$4("add: stored new file %s", file.fileName);
   } else {
     const isVirtualModule = script.id.startsWith("/@id/") || script.id.startsWith("/__");
-    if (isVirtualModule) {
+    const isTimestampedModule = script.type === "module" && /[?&]t=\d+/.test(script.id);
+    if (isVirtualModule || isTimestampedModule) {
       debug$4(
-        "add: virtual module already exists, triggering re-write for %s",
+        "add: module already exists, triggering re-write for %s",
         fileName
       );
-      file.file = write(script);
+      file = formatFileData({
+        ...file,
+        ...script,
+        fileName,
+        file: queueWrite(script, file)
+      });
       outputFiles.set(fileName, file);
     }
   }
@@ -618,7 +816,7 @@ function update(_id) {
     const scriptFile = outputFiles.get(fileName);
     if (scriptFile) {
       debug$4("update: found file, calling write()");
-      scriptFile.file = write({ id, type });
+      scriptFile.file = queueWrite({ id, type }, scriptFile);
       updatedFiles.push(scriptFile);
       outputFiles.set(fileName, scriptFile);
     }
@@ -663,6 +861,7 @@ const pluginContentScripts = () => {
   let server;
   let preambleCode;
   let hmrTimeout;
+  let liveReload = true;
   let sub = new Subscription();
   const worldMainIds = /* @__PURE__ */ new Set();
   const findWorldMainIds = async (config, env) => {
@@ -690,9 +889,11 @@ const pluginContentScripts = () => {
       apply: "serve",
       async config(config, env) {
         await findWorldMainIds(config, env);
-        const { contentScripts: contentScripts2 = {} } = await getOptions(config);
+        const opts = await getOptions(config);
+        const { contentScripts: contentScripts2 = {} } = opts;
         hmrTimeout = contentScripts2.hmrTimeout ?? 5e3;
         preambleCode = preambleCode ?? contentScripts2.preambleCode;
+        liveReload = opts.liveReload !== false;
       },
       async configureServer(_server) {
         server = _server;
@@ -702,7 +903,7 @@ const pluginContentScripts = () => {
           try {
             const react = await import('@vitejs/plugin-react');
             preambleCode = react.default.preambleCode;
-          } catch (error) {
+          } catch {
             preambleCode = false;
           }
         }
@@ -728,7 +929,8 @@ const pluginContentScripts = () => {
               });
               script.fileName = loader.fileName;
             } else if (type === "iife") {
-              throw new Error("IIFE content scripts are not implemented");
+              const file = add({ type: "iife", id });
+              script.fileName = file.fileName;
             } else {
               const file = add({ type: "module", id });
               script.fileName = file.fileName;
@@ -748,10 +950,7 @@ const pluginContentScripts = () => {
           return defined;
         }
         if (id === contentHmrPortId) {
-          const defined = contentHmrPort.replace(
-            "__CRX_HMR_TIMEOUT__",
-            JSON.stringify(hmrTimeout)
-          );
+          const defined = contentHmrPort.replace("__CRX_HMR_TIMEOUT__", JSON.stringify(hmrTimeout)).replace("__CRX_LIVE_RELOAD__", JSON.stringify(liveReload));
           return defined;
         }
       },
@@ -779,41 +978,50 @@ const pluginContentScripts = () => {
         };
       },
       generateBundle(_options, bundle) {
-        for (const [key, script] of contentScripts)
-          if (key === script.refId) {
-            if (script.type === "module") {
-              const fileName = this.getFileName(script.refId);
-              script.fileName = fileName;
-            } else if (script.type === "loader") {
-              const fileName = this.getFileName(script.refId);
-              script.fileName = fileName;
-              const bundleFileInfo = bundle[fileName];
-              const shouldUseLoader = !(bundleFileInfo.type === "chunk" && bundleFileInfo.imports.length === 0 && bundleFileInfo.dynamicImports.length === 0 && bundleFileInfo.exports.length === 0);
-              if (shouldUseLoader) {
-                const refId = this.emitFile({
-                  type: "asset",
-                  name: getFileName({
-                    type: "loader",
-                    id: basename(script.id)
-                  }),
-                  source: worldMainIds.has(script.id) ? createProMainLoader({
-                    fileName: `./${fileName.split("/").at(-1)}`
-                  }) : createProLoader({ fileName })
-                });
-                script.loaderName = this.getFileName(refId);
-              } else {
-                bundleFileInfo.code = `(function(){${bundleFileInfo.code}})()
-`;
-              }
-            } else if (script.type === "iife") {
-              throw new Error("IIFE content scripts are not implemented");
-            }
-            contentScripts.set(script.refId, formatFileData(script));
-          }
+        finalizeBuildContentScripts(this, bundle, worldMainIds);
       }
     }
   ];
 };
+function finalizeBuildContentScripts(context, bundle, worldMainIds = /* @__PURE__ */ new Set()) {
+  const processed = /* @__PURE__ */ new Set();
+  for (const [key, script] of contentScripts) {
+    if (key !== script.refId || processed.has(script))
+      continue;
+    processed.add(script);
+    if (script.type === "module") {
+      script.fileName = script.fileName ?? context.getFileName(script.refId);
+    } else if (script.type === "loader") {
+      const fileName = script.fileName ?? context.getFileName(script.refId);
+      script.fileName = fileName;
+      const bundleFileInfo = bundle[fileName];
+      if (bundleFileInfo?.type !== "chunk")
+        continue;
+      const shouldUseLoader = !(bundleFileInfo.imports.length === 0 && bundleFileInfo.dynamicImports.length === 0 && bundleFileInfo.exports.length === 0);
+      if (shouldUseLoader) {
+        if (typeof script.loaderName === "undefined") {
+          const refId = context.emitFile({
+            type: "asset",
+            name: getFileName({
+              type: "loader",
+              id: basename(script.id)
+            }),
+            source: worldMainIds.has(script.id) ? createProMainLoader({
+              fileName: `./${fileName.split("/").at(-1)}`
+            }) : createProLoader({ fileName })
+          });
+          script.loaderName = context.getFileName(refId);
+        }
+      } else if (typeof script.loaderName === "undefined" && !bundleFileInfo.code.startsWith("(function(){")) {
+        bundleFileInfo.code = `(function(){${bundleFileInfo.code}})()
+`;
+      }
+    } else if (script.type === "iife") {
+      continue;
+    }
+    contentScripts.set(script.refId, formatFileData(script));
+  }
+}
 
 const pluginContentScriptsCss = () => {
   let injectCss;
@@ -890,6 +1098,196 @@ const pluginDeclaredContentScripts = () => {
   };
 };
 
+function isIifeContentScript(file) {
+  return /\.iife\.(ts|tsx|js|jsx|mjs|cjs)$/.test(file);
+}
+const pluginContentScriptsIife = () => {
+  const pluginName = "crx:content-scripts-iife";
+  let config;
+  return [
+    {
+      name: `${pluginName}-config`,
+      enforce: "pre",
+      configResolved(resolvedConfig) {
+        config = resolvedConfig;
+      }
+    },
+    {
+      name: pluginName,
+      apply: "build",
+      enforce: "post",
+      async generateBundle() {
+        const opts = await getOptions({ plugins: config.plugins });
+        const _manifest = opts.manifest;
+        const manifest = typeof _manifest === "function" ? await _manifest({ command: "build", mode: config.mode }) : await Promise.resolve(_manifest);
+        const standaloneFiles = (opts.contentScripts?.standaloneFiles || []).map(
+          normalizeContentScriptPath
+        );
+        const iifeEntries = collectIifeEntries(
+          manifest,
+          standaloneFiles,
+          config.root
+        );
+        if (iifeEntries.length === 0)
+          return;
+        console.log(
+          pc.cyan(`
+[${pluginName}] Building ${iifeEntries.length} content script(s) as IIFE...`)
+        );
+        for (const entry of iifeEntries) {
+          const outputFileName = getIifeOutputPath(entry.file);
+          try {
+            const iifeConfig = createIifeConfig(config, entry.id, outputFileName);
+            const result = await build(iifeConfig);
+            const outputs = getBuildOutputs(result, entry.file);
+            emitIifeOutputs(this, outputs, entry.file, outputFileName);
+            registerIifeContentScript(entry, outputFileName);
+            console.log(
+              pc.green(`  \u2713 ${basename(entry.file)} \u2192 ${outputFileName}`)
+            );
+          } catch (error) {
+            console.error(
+              pc.red(`  \u2717 Failed to build ${entry.file}:`),
+              error
+            );
+            throw error;
+          }
+        }
+        console.log(pc.cyan(`[${pluginName}] IIFE build complete
+`));
+      }
+    }
+  ];
+};
+function normalizeContentScriptPath(file) {
+  return file.replace(/^\//, "");
+}
+function isStandaloneFile(file, standaloneFiles) {
+  return standaloneFiles.includes(normalizeContentScriptPath(file));
+}
+function collectIifeEntries(manifest, standaloneFiles, root) {
+  const entries = [];
+  const entryIds = /* @__PURE__ */ new Set();
+  const addEntry = (entry) => {
+    if (entryIds.has(entry.id))
+      return;
+    entryIds.add(entry.id);
+    entries.push(entry);
+  };
+  for (const { js = [], matches = [] } of manifest.content_scripts ?? []) {
+    for (const file of js) {
+      if (isIifeContentScript(file) || isStandaloneFile(file, standaloneFiles)) {
+        addEntry({ file, id: join(root, file), matches });
+      }
+    }
+  }
+  for (const [, script] of contentScripts.entries()) {
+    if (script.type !== "iife" || !script.isDynamicScript)
+      continue;
+    addEntry({
+      file: script.id,
+      id: join(root, script.id),
+      matches: script.matches ?? []
+    });
+  }
+  return entries;
+}
+function getBuildOutputs(result, entryFile) {
+  if ("on" in result) {
+    throw new Error(`Unexpected watcher result for "${entryFile}"`);
+  }
+  return Array.isArray(result) ? result.flatMap((r) => r.output) : result.output;
+}
+function emitIifeOutputs(context, outputs, entryFile, outputFileName) {
+  const entryChunk = outputs.find(
+    (output) => output.type === "chunk" && output.isEntry
+  );
+  if (!entryChunk) {
+    throw new Error(`Unable to generate IIFE bundle for "${entryFile}"`);
+  }
+  context.emitFile({
+    type: "asset",
+    fileName: outputFileName,
+    source: entryChunk.code
+  });
+  for (const output of outputs) {
+    if (output.type === "asset") {
+      if (output.fileName !== outputFileName && output.fileName !== "manifest.json" && !output.fileName.startsWith(".vite/")) {
+        context.emitFile({
+          type: "asset",
+          fileName: output.fileName,
+          source: output.source
+        });
+      }
+    } else if (!output.isEntry) {
+      context.emitFile({
+        type: "asset",
+        fileName: output.fileName,
+        source: output.code
+      });
+    }
+  }
+}
+function registerIifeContentScript(entry, outputFileName) {
+  const existingScript = contentScripts.get(entry.file);
+  const script = existingScript ? { ...existingScript, fileName: outputFileName } : {
+    type: "iife",
+    id: entry.file,
+    refId: entry.file,
+    matches: entry.matches,
+    fileName: outputFileName
+  };
+  contentScripts.set(entry.file, formatFileData(script));
+}
+function getIifeOutputPath(file) {
+  const normalizedFile = file.replace(/^\//, "");
+  const dir = dirname(normalizedFile);
+  const name = basename(normalizedFile).replace(/\.(ts|tsx|js|jsx|mjs|cjs)$/, "");
+  return dir && dir !== "." ? `${dir}/${name}.js` : `${name}.js`;
+}
+function createIifeConfig(parentConfig, entryPath, outputFileName) {
+  const entryName = basename(outputFileName, ".js");
+  const baseConfig = {
+    // Inherit relevant settings from parent config
+    root: parentConfig.root,
+    mode: parentConfig.mode,
+    resolve: parentConfig.resolve,
+    define: parentConfig.define,
+    esbuild: parentConfig.esbuild
+  };
+  const iifeConfig = {
+    configFile: false,
+    logLevel: "warn",
+    plugins: [],
+    build: {
+      write: false,
+      // Don't write to disk, we'll add to bundle
+      emptyOutDir: false,
+      lib: {
+        entry: entryPath,
+        formats: ["iife"],
+        name: safeVarName(entryName),
+        fileName: () => outputFileName
+      },
+      rollupOptions: {
+        output: {
+          entryFileNames: outputFileName,
+          // Ensure all dependencies are inlined
+          inlineDynamicImports: true
+        }
+      },
+      // Match parent config settings
+      minify: parentConfig.build.minify,
+      sourcemap: parentConfig.build.sourcemap,
+      target: parentConfig.build.target
+    }
+  };
+  return mergeConfig(baseConfig, iifeConfig);
+}
+function safeVarName(name) {
+  return name.replace(/[^a-zA-Z0-9_$]/g, "_").replace(/^(\d)/, "_$1").replace(/^$/, "_");
+}
+
 const _dynamicScriptRegEx = /\b(import.meta).CRX_DYNAMIC_SCRIPT_(.+?)[,;]/gm;
 const dynamicScriptRegEx = () => {
   _dynamicScriptRegEx.lastIndex = 0;
@@ -897,12 +1295,48 @@ const dynamicScriptRegEx = () => {
 };
 const pluginDynamicContentScripts = () => {
   let config;
+  let standaloneFiles = [];
   return [
     {
       name: "crx:dynamic-content-scripts-loader",
       enforce: "pre",
       configResolved(_config) {
         config = _config;
+        getOptions({ plugins: _config.plugins }).then((opts) => {
+          standaloneFiles = (opts.contentScripts?.standaloneFiles || []).map(
+            (f) => f.replace(/^\//, "")
+          );
+        }).catch(() => void 0);
+      },
+      buildStart() {
+        if (config.command === "build") {
+          const dynamicScripts = [];
+          for (const [key, script] of contentScripts) {
+            if (script.isDynamicScript && key === script.scriptId) {
+              dynamicScripts.push(script);
+            }
+          }
+          contentScripts.clear();
+          for (const script of dynamicScripts) {
+            const absoluteId = script.id.startsWith("/") ? `${config.root}${script.id}` : `${config.root}/${script.id}`;
+            const refId = this.emitFile({
+              type: "chunk",
+              id: absoluteId,
+              name: basename(script.id)
+            });
+            contentScripts.set(
+              script.id,
+              formatFileData({
+                type: script.type,
+                id: script.id,
+                isDynamicScript: true,
+                refId,
+                scriptId: script.scriptId,
+                matches: script.matches
+              })
+            );
+          }
+        }
       },
       configureServer(server) {
         return () => {
@@ -933,9 +1367,9 @@ const pluginDynamicContentScripts = () => {
         };
       },
       async resolveId(_source, importer) {
-        if (importer && _source.includes("?script")) {
+        if (importer && (_source.includes("?script") || _source.includes("?iife"))) {
           const url = new URL(_source, "stub://stub");
-          if (url.searchParams.has("script")) {
+          if (url.searchParams.has("script") || url.searchParams.has("iife")) {
             const [source] = _source.split("?");
             const resolved = await this.resolve(source, importer, {
               skipSelf: true
@@ -945,8 +1379,11 @@ const pluginDynamicContentScripts = () => {
                 `Could not resolve dynamic script: "${_source}" from "${importer}"`
               );
             const { id } = resolved;
+            const relId = relative(config.root, id).replace(/^\//, "");
             let type = "loader";
-            if (url.searchParams.has("module")) {
+            if (isIifeContentScript(relId) || standaloneFiles.includes(relId)) {
+              type = "iife";
+            } else if (url.searchParams.has("module")) {
               type = "module";
             } else if (url.searchParams.has("iife")) {
               type = "iife";
@@ -962,17 +1399,20 @@ const pluginDynamicContentScripts = () => {
                 refId = this.emitFile({
                   type: "chunk",
                   id,
-                  name: basename(id)
+                  name: basename(id),
+                  // Preserve content script entry exports so the build finalizer
+                  // can decide whether the script needs a loader wrapper.
+                  preserveSignature: "exports-only"
                 });
               } else {
                 refId = scriptId;
-                const relId = relative(config.root, id);
+                const relId2 = relative(config.root, id);
                 fileName = getFileName({
                   type: type === "iife" ? "iife" : "module",
-                  id: relId
+                  id: relId2
                 });
                 if (type === "loader")
-                  loaderName = getFileName({ type, id: relId });
+                  loaderName = getFileName({ type, id: relId2 });
               }
               script = formatFileData({
                 type,
@@ -996,9 +1436,29 @@ const pluginDynamicContentScripts = () => {
         const index = id.indexOf("?scriptId=");
         if (index > -1) {
           const scriptId = id.slice(index + "?scriptId=".length);
-          const script = contentScripts.get(scriptId);
+          let script = contentScripts.get(scriptId);
+          if (!script && config.command === "build") {
+            const fileId = id.slice(0, index);
+            const refId = this.emitFile({
+              type: "chunk",
+              id: fileId,
+              name: basename(fileId)
+            });
+            script = formatFileData({
+              type: "loader",
+              id: relative(config.root, fileId),
+              isDynamicScript: true,
+              refId,
+              scriptId,
+              matches: []
+            });
+            contentScripts.set(script.id, script);
+          }
+          if (!script) {
+            throw new Error(`Content script not found for scriptId: "${scriptId}"`);
+          }
           if (config.command === "build") {
-            return `export default import.meta.CRX_DYNAMIC_SCRIPT_${script.refId};`;
+            return `export default import.meta.CRX_DYNAMIC_SCRIPT_${script.scriptId};`;
           } else if (typeof script.fileName === "string") {
             return `export default ${JSON.stringify(script.fileName)};`;
           } else {
@@ -1018,6 +1478,7 @@ const pluginDynamicContentScripts = () => {
        * Can't use `renderChunk` b/c pre plugin crx:content-scripts uses
        * `generateBundle` to emit loaders. Must come after "enforce: pre".
        */
+      enforce: "post",
       generateBundle(options, bundle) {
         for (const chunk of Object.values(bundle))
           if (chunk.type === "chunk") {
@@ -1034,9 +1495,9 @@ const pluginDynamicContentScripts = () => {
                     throw new Error(
                       `Content script fileName is undefined: "${script.id}"`
                     );
-                  return `${JSON.stringify(
-                    `/${script.loaderName ?? script.fileName}`
-                  )}${match.split(scriptKey)[1]}`;
+                  const fileName = script.loaderName ?? script.fileName;
+                  const path = fileName;
+                  return `${JSON.stringify(path)}${match.split(scriptKey)[1]}`;
                 }
               );
               chunk.code = replaced;
@@ -1121,7 +1582,7 @@ const pluginFileWriterPolyfill = () => {
 async function manifestFiles(manifest, options = {}) {
   let locales = [];
   if (manifest.default_locale)
-    locales = await fg("_locales/**/messages.json", options);
+    locales = await glob("_locales/**/messages.json", options);
   const rulesets = manifest.declarative_net_request?.rule_resources.flatMap(
     ({ path }) => path
   ) ?? [];
@@ -1145,8 +1606,8 @@ async function manifestFiles(manifest, options = {}) {
       manifest.web_accessible_resources.flatMap(({ resources: resources2 }) => resources2).map(async (r) => {
         if (["*", "**/*"].includes(r))
           return void 0;
-        if (fg.isDynamicPattern(r))
-          return fg(r, options);
+        if (isDynamicPattern(r))
+          return glob(r, options);
         return r;
       })
     );
@@ -1164,7 +1625,7 @@ async function manifestFiles(manifest, options = {}) {
   };
 }
 async function dirFiles(dir) {
-  const files = await fg(join(dir, "**", "*"));
+  const files = await glob(join(dir, "**", "*"));
   return files;
 }
 function htmlFiles(manifest) {
@@ -1205,6 +1666,89 @@ const isCustomPayload = (p) => {
   return p.type === "custom";
 };
 const hmrPayload$ = new Subject();
+function withTimestamp(id, timestamp) {
+  if (id.includes("?t=") || id.includes("&t="))
+    return id;
+  const t = `t=${timestamp}` + (id.includes("?") ? "&" : "");
+  const parts = id.split("?");
+  parts[1] = typeof parts[1] === "undefined" ? t : t + parts[1];
+  return parts.join("?");
+}
+function getUpdatePayloadFileIds(p, { timestamp = false } = {}) {
+  const ids = /* @__PURE__ */ new Set();
+  for (const u of p.updates) {
+    for (const id of [u.path, u.acceptedPath]) {
+      const isVirtualModule = id.startsWith("/@id/") || id.startsWith("/__");
+      const isQueryModule = id.includes("?");
+      if (isVirtualModule || isQueryModule)
+        ids.add(timestamp ? withTimestamp(id, u.timestamp) : id);
+    }
+  }
+  return [...ids];
+}
+function mapVitePayloadForCrx(p) {
+  switch (p.type) {
+    case "full-reload": {
+      const fullReload = {
+        type: "full-reload",
+        path: p.path && getViteUrl({ id: p.path, type: "module" })
+      };
+      return fullReload;
+    }
+    case "prune": {
+      const prune = {
+        type: "prune",
+        paths: p.paths.map((id) => getViteUrl({ id, type: "module" }))
+      };
+      return prune;
+    }
+    case "update": {
+      debug$3("update payload with %d updates", p.updates.length);
+      for (const u of p.updates) {
+        debug$3(
+          "update item: path=%s acceptedPath=%s type=%s",
+          u.path,
+          u.acceptedPath,
+          u.type
+        );
+      }
+      const update_ = {
+        type: "update",
+        updates: p.updates.map(({ acceptedPath: ap, path: p2, ...rest }) => ({
+          ...rest,
+          acceptedPath: prefix$1("/", getFileName({ id: ap, type: "module" })),
+          path: prefix$1("/", getFileName({ id: p2, type: "module" }))
+        }))
+      };
+      return update_;
+    }
+    default:
+      return p;
+  }
+}
+async function prepareVitePayloadForCrx(p) {
+  if (p.type === "update") {
+    const pendingFiles = getUpdatePayloadFileIds(p, {
+      timestamp: true
+    }).flatMap((id) => {
+      debug$3("updating payload module: %s", id);
+      return update(id).map((file) => file.file);
+    });
+    await Promise.all(pendingFiles);
+    await firstValueFrom(allFilesReady$);
+  }
+  return mapVitePayloadForCrx(p);
+}
+function shouldForwardCrxPayload(p) {
+  switch (p.type) {
+    case "prune":
+      return p.paths.length > 0;
+    case "update":
+      return p.updates.length > 0;
+    default:
+      return true;
+  }
+}
 const crxHMRPayload$ = hmrPayload$.pipe(
   filter((p) => !isCustomPayload(p)),
   buffer(allFilesReady$),
@@ -1221,63 +1765,8 @@ const crxHMRPayload$ = hmrPayload$.pipe(
       payloads.push(fullReload);
     return payloads;
   }),
-  map((p) => {
-    switch (p.type) {
-      case "full-reload": {
-        const fullReload = {
-          type: "full-reload",
-          path: p.path && getViteUrl({ id: p.path, type: "module" })
-        };
-        return fullReload;
-      }
-      case "prune": {
-        const prune = {
-          type: "prune",
-          paths: p.paths.map((id) => getViteUrl({ id, type: "module" }))
-        };
-        return prune;
-      }
-      case "update": {
-        debug$3("update payload with %d updates", p.updates.length);
-        for (const u of p.updates) {
-          debug$3(
-            "update item: path=%s acceptedPath=%s type=%s",
-            u.path,
-            u.acceptedPath,
-            u.type
-          );
-          const isVirtualModule = u.path.startsWith("/@id/") || u.path.startsWith("/__");
-          if (isVirtualModule) {
-            debug$3("updating virtual module: %s", u.path);
-            update(u.path);
-          }
-        }
-        const update_ = {
-          type: "update",
-          updates: p.updates.map(({ acceptedPath: ap, path: p2, ...rest }) => ({
-            ...rest,
-            acceptedPath: prefix$1("/", getFileName({ id: ap, type: "module" })),
-            path: prefix$1("/", getFileName({ id: p2, type: "module" }))
-          }))
-        };
-        return update_;
-      }
-      default:
-        return p;
-    }
-  }),
-  filter((p) => {
-    switch (p.type) {
-      case "full-reload":
-        return typeof p.path === "undefined";
-      case "prune":
-        return p.paths.length > 0;
-      case "update":
-        return p.updates.length > 0;
-      default:
-        return true;
-    }
-  }),
+  mergeMap(prepareVitePayloadForCrx),
+  filter(shouldForwardCrxPayload),
   map((data) => {
     debug$3(`hmr payload`, data);
     return {
@@ -1309,11 +1798,29 @@ const crxRuntimeReload = {
   type: "custom",
   event: "crx:runtime-reload"
 };
+function getChangedFilePath(root, file) {
+  if (!file)
+    return null;
+  const normalizedRoot = normalize(root);
+  const normalizedFile = normalize(file);
+  const relativeFile = relative(normalizedRoot, normalizedFile);
+  if (!relativeFile || relativeFile.startsWith("..") || isAbsolute(relativeFile)) {
+    return null;
+  }
+  return prefix$1("/", relativeFile);
+}
+function stripTimestamp(id) {
+  return id.replace(/([?&])t=\d+&/, "$1").replace(/[?&]t=\d+$/, "").replace(/\?$/, "");
+}
+function escapeRegExp(text) {
+  return text.replace(/[.*+?^${}()|[\]\\]/g, "\\$&");
+}
 const pluginHMR = () => {
   let inputManifestFiles;
   let decoratedSend;
   let config;
   let subs;
+  let liveReload = true;
   return [
     {
       name: "crx:hmr",
@@ -1321,6 +1828,8 @@ const pluginHMR = () => {
       enforce: "pre",
       // server hmr host should be localhost
       async config({ server = {}, ...config2 }) {
+        const opts = await getOptions({ ...config2, server });
+        liveReload = opts.liveReload !== false;
         if (server.hmr === false)
           return;
         if (server.hmr === true)
@@ -1359,7 +1868,9 @@ const pluginHMR = () => {
           subs.add(fileWriterError$.subscribe(send));
           subs.add(
             crxHMRPayload$.subscribe((payload) => {
-              send(payload);
+              if (liveReload) {
+                send(payload);
+              }
             })
           );
         }
@@ -1368,14 +1879,16 @@ const pluginHMR = () => {
         subs.unsubscribe();
       },
       // background changes require a full extension reload
-      handleHotUpdate({ modules, server }) {
+      handleHotUpdate({ file, modules, server }) {
         const { root } = server.config;
+        const changedFilePath = getChangedFilePath(root, file);
         const relFiles = /* @__PURE__ */ new Set();
         const fsFiles = /* @__PURE__ */ new Set();
         const virtualModules = /* @__PURE__ */ new Set();
         for (const m of modules) {
-          if (m.id?.startsWith(root)) {
-            relFiles.add(m.id.slice(server.config.root.length));
+          const relFile = getChangedFilePath(root, m.id);
+          if (relFile) {
+            relFiles.add(relFile);
           } else if (m.url?.startsWith("/@fs")) {
             fsFiles.add(m.url);
           } else if (m.id?.startsWith("\0") || m.url?.startsWith("/@id/__x00__")) {
@@ -1386,13 +1899,17 @@ const pluginHMR = () => {
             }
           }
         }
-        fsFiles.forEach((file) => update(file));
-        virtualModules.forEach((file) => update(file));
+        fsFiles.forEach((file2) => update(file2));
+        virtualModules.forEach((file2) => update(file2));
         if (inputManifestFiles.background.length) {
           const background = prefix$1("/", inputManifestFiles.background[0]);
           if (relFiles.has(background) || modules.some(isImporter(join(server.config.root, background)))) {
-            debug$2("sending runtime reload");
-            server.ws.send(crxRuntimeReload);
+            if (liveReload) {
+              debug$2("sending runtime reload");
+              server.ws.send(crxRuntimeReload);
+            } else {
+              debug$2("skipping runtime reload (liveReload disabled)");
+            }
           }
         }
         for (const [key, script] of contentScripts)
@@ -1409,15 +1926,26 @@ const pluginHMR = () => {
                 if (changedCssFiles.length > 0) {
                   changedCssFiles.forEach((relFile) => update(relFile));
                   update(script.id);
-                  virtualModules.forEach((file) => update(file));
+                  virtualModules.forEach((file2) => update(file2));
                 }
               }
             } else {
               if (relFiles.has(script.id) || modules.some(isImporter(join(server.config.root, script.id)))) {
                 relFiles.forEach((relFile) => update(relFile));
-                virtualModules.forEach((file) => update(file));
+                virtualModules.forEach((file2) => update(file2));
               }
             }
+            const scriptPath = prefix$1("/", script.id);
+            if (script.type === "iife" && changedFilePath === scriptPath) {
+              debug$2("IIFE script changed, triggering rebuild: %s", script.id);
+              const updatedFiles = update(scriptPath);
+              Promise.all(updatedFiles.map((f) => f.file)).then(() => {
+                if (liveReload) {
+                  debug$2("IIFE rebuild complete, sending runtime reload");
+                  server.ws.send(crxRuntimeReload);
+                }
+              });
+            }
           }
       }
     },
@@ -1432,13 +1960,14 @@ const pluginHMR = () => {
       },
       renderCrxDevScript(code, { id: _id, type }) {
         if (type === "module" && _id !== "/@vite/client" && code.includes("createHotContext")) {
-          const id = _id.replace(/t=\d+&/, "");
-          const escaped = id.replace(/([?&.])/g, "\\$1");
+          const id = stripTimestamp(_id);
+          const escaped = escapeRegExp(id);
           const regexp = new RegExp(
-            `(?<=createHotContext\\(")${escaped}(?="\\))`
+            `(createHotContext\\(")${escaped}("\\))`,
+            "g"
           );
           const fileUrl = prefix$1("/", getFileName({ id, type }));
-          const replaced = code.replace(regexp, fileUrl);
+          const replaced = code.replace(regexp, `$1${fileUrl}$2`);
           return replaced;
         } else {
           return code;
@@ -1614,14 +2143,50 @@ const pluginHtmlInlineScripts = () => {
   };
 };
 
-var loadingPageScript = "const VITE_URL = \"%PROTO%://localhost:%PORT%\";\ndocument.body.innerHTML = /* html */\n`\n<style>\n  :root {\n    color-scheme: light;\n    --ink: #111827;\n    --muted: #5f6b7a;\n    --muted-subtle: rgba(95, 107, 122, 0.7);\n    --muted-hint: rgba(95, 107, 122, 0.6);\n    --card: #ffffff;\n    --badge-bg: rgba(17, 24, 39, 0.04);\n    --accent: #ff6b2c;\n    --accent-2: #2563eb;\n    --link-underline: rgba(37, 99, 235, 0.45);\n    --glow-1: rgba(37, 99, 235, 0.12);\n    --glow-2: rgba(255, 107, 44, 0.1);\n    --button-grad-1: #ff7a43;\n    --button-grad-2: #ff9a73;\n    --button-shadow: rgba(255, 107, 44, 0.18);\n    --button-shadow-hover: rgba(255, 107, 44, 0.22);\n    --pulse: rgba(255, 107, 44, 0.6);\n    --pulse-ring: rgba(255, 107, 44, 0.5);\n  }\n\n  @media (prefers-color-scheme: dark) {\n    :root {\n      color-scheme: dark;\n      --ink: #e5e7eb;\n      --muted: #a3aab5;\n      --muted-subtle: rgba(163, 170, 181, 0.78);\n      --muted-hint: rgba(163, 170, 181, 0.6);\n      --card: #0f172a;\n      --badge-bg: rgba(148, 163, 184, 0.16);\n      --accent: #ff8a5a;\n      --accent-2: #7aa2ff;\n      --link-underline: rgba(122, 162, 255, 0.45);\n      --glow-1: rgba(96, 165, 250, 0.14);\n      --glow-2: rgba(251, 146, 60, 0.16);\n      --button-grad-1: #f07b4d;\n      --button-grad-2: #f39a76;\n      --button-shadow: rgba(240, 123, 77, 0.16);\n      --button-shadow-hover: rgba(240, 123, 77, 0.2);\n      --pulse: rgba(255, 138, 90, 0.65);\n      --pulse-ring: rgba(255, 138, 90, 0.5);\n    }\n  }\n\n  * {\n    margin: 0;\n    padding: 0;\n    box-sizing: border-box;\n  }\n\n  body {\n    font-family: \"IBM Plex Sans\", \"Inter\", -apple-system, system-ui, sans-serif;\n    color: var(--ink);\n    background: transparent;\n    width: 420px;\n    height: 250px;\n    margin: 0;\n    padding: 0 !important;\n  }\n\n  #app {\n    background: var(--card);\n    position: relative;\n    overflow: hidden;\n    display: flex;\n    flex-direction: column;\n    min-height: 100%;\n    padding: 24px 24px 20px;\n    gap: 14px;\n    justify-content: center;\n  }\n\n  #app::before {\n    content: \"\";\n    position: absolute;\n    inset: 0;\n    background:\n      radial-gradient(240px 140px at 100% 0%, var(--glow-1), transparent 70%),\n      radial-gradient(220px 140px at 0% 100%, var(--glow-2), transparent 70%);\n    pointer-events: none;\n  }\n\n  .header {\n    position: relative;\n    display: flex;\n    flex-direction: column;\n    gap: 6px;\n    align-items: flex-start;\n    padding-right: 96px;\n  }\n\n  .header-text {\n    display: flex;\n    flex-direction: column;\n    gap: 4px;\n  }\n\n  .badge {\n    display: inline-flex;\n    align-items: center;\n    gap: 8px;\n    font-size: 10px;\n    letter-spacing: 0.08em;\n    text-transform: uppercase;\n    color: var(--muted);\n    background: var(--badge-bg);\n    border-radius: 999px;\n    padding: 6px 10px;\n    white-space: nowrap;\n    position: absolute;\n    top: 0;\n    right: 0;\n  }\n\n  .pulse {\n    width: 8px;\n    height: 8px;\n    border-radius: 50%;\n    background: var(--accent);\n    box-shadow: 0 0 0 0 var(--pulse);\n    animation: pulse 1.6s ease-in-out infinite;\n  }\n\n  h1 {\n    font-size: clamp(18px, 4vw, 22px);\n    letter-spacing: -0.02em;\n    line-height: 1.25;\n  }\n\n  p {\n    margin: 0;\n    color: var(--muted);\n    font-size: 13px;\n    line-height: 1.6;\n  }\n\n  .subtle {\n    color: var(--muted-subtle);\n    font-size: 12px;\n  }\n\n  a {\n    color: var(--accent-2);\n    text-decoration: none;\n    border-bottom: 1px dashed var(--link-underline);\n  }\n\n  .content {\n    display: flex;\n    flex-direction: column;\n    gap: 10px;\n  }\n\n  .footer {\n    display: flex;\n    flex-direction: column;\n    gap: 10px;\n    align-items: center;\n  }\n\n  .actions {\n    display: flex;\n    flex-wrap: wrap;\n    gap: 12px;\n    justify-content: center;\n  }\n\n  button {\n    appearance: none;\n    border: none;\n    border-radius: 999px;\n    background: linear-gradient(135deg, var(--button-grad-1), var(--button-grad-2));\n    color: white;\n    padding: 8px 14px;\n    font-size: 12px;\n    font-weight: 600;\n    cursor: pointer;\n    box-shadow: 0 8px 16px var(--button-shadow);\n    transition: transform 160ms ease, box-shadow 160ms ease;\n  }\n\n  button:hover {\n    transform: translateY(-1px);\n    box-shadow: 0 10px 20px var(--button-shadow-hover);\n  }\n\n  button:focus-visible {\n    outline: 2px solid var(--accent-2);\n    outline-offset: 2px;\n  }\n\n  .hint {\n    font-size: 11px;\n    color: var(--muted-hint);\n    text-align: center;\n  }\n\n  @keyframes pulse {\n    0% { box-shadow: 0 0 0 0 var(--pulse-ring); }\n    70% { box-shadow: 0 0 0 10px rgba(255, 107, 44, 0); }\n    100% { box-shadow: 0 0 0 0 rgba(255, 107, 44, 0); }\n  }\n</style>\n\n<div id=\"app\">\n  <div class=\"header\">\n    <span class=\"badge\"><span class=\"pulse\"></span>dev server</span>\n    <div class=\"header-text\">\n      <h1>CRXJS DEV MODE</h1>\n      <p class=\"subtle\">Connecting to the Vite dev server\\u2026</p>\n    </div>\n  </div>\n\n  <div class=\"content\">\n    <p>\n      Cannot connect to <a href=\"${VITE_URL}\">${VITE_URL}</a>.\n      Make sure Vite is running, then reload the extension.\n    </p>\n    <p>This page will close automatically after the extension reloads.</p>\n  </div>\n\n  <div class=\"footer\">\n    <div class=\"actions\">\n      <button>Reload Extension</button>\n    </div>\n    <div class=\"hint\">Tip: if the URL is wrong, restart Vite so it picks the right port.</div>\n  </div>\n</div>\n`;\ndocument.body.querySelector(\"button\")?.addEventListener(\"click\", () => {\n  chrome.runtime.reload();\n});\nlet tries = 0;\nlet ready = false;\ndo {\n  try {\n    await fetch(VITE_URL);\n    ready = true;\n  } catch {\n    const timeout = Math.min(100 * Math.pow(2, ++tries), 5e3);\n    console.log(`[CRXJS] Vite Dev Server is not available on ${VITE_URL}`);\n    console.log(`[CRXJS] Retrying in ${timeout}ms...`);\n    await new Promise((resolve) => setTimeout(resolve, timeout));\n  }\n} while (!ready);\nlocation.reload();\n";
+var loadingPageScript = "const VITE_URL = \"%PROTO%://localhost:%PORT%\";\nconst READY_PATH = \"%READY_PATH%\";\nconst VITE_PAGE_URL = new URL(location.pathname + location.search, VITE_URL).href;\nconst RELOAD_DELAY = 100;\nfunction getReadyUrl() {\n  const url = new URL(READY_PATH, VITE_URL);\n  url.searchParams.set(\"path\", location.pathname + location.search);\n  url.searchParams.set(\"t\", Date.now().toString());\n  return url.href;\n}\ndocument.body.innerHTML = /* html */\n`\n<style>\n  :root {\n    color-scheme: light;\n    --ink: #111827;\n    --muted: #5f6b7a;\n    --muted-subtle: rgba(95, 107, 122, 0.7);\n    --muted-hint: rgba(95, 107, 122, 0.6);\n    --card: #ffffff;\n    --badge-bg: rgba(17, 24, 39, 0.04);\n    --accent: #ff6b2c;\n    --accent-2: #2563eb;\n    --link-underline: rgba(37, 99, 235, 0.45);\n    --glow-1: rgba(37, 99, 235, 0.12);\n    --glow-2: rgba(255, 107, 44, 0.1);\n    --button-grad-1: #ff7a43;\n    --button-grad-2: #ff9a73;\n    --button-shadow: rgba(255, 107, 44, 0.18);\n    --button-shadow-hover: rgba(255, 107, 44, 0.22);\n    --pulse: rgba(255, 107, 44, 0.6);\n    --pulse-ring: rgba(255, 107, 44, 0.5);\n  }\n\n  @media (prefers-color-scheme: dark) {\n    :root {\n      color-scheme: dark;\n      --ink: #e5e7eb;\n      --muted: #a3aab5;\n      --muted-subtle: rgba(163, 170, 181, 0.78);\n      --muted-hint: rgba(163, 170, 181, 0.6);\n      --card: #0f172a;\n      --badge-bg: rgba(148, 163, 184, 0.16);\n      --accent: #ff8a5a;\n      --accent-2: #7aa2ff;\n      --link-underline: rgba(122, 162, 255, 0.45);\n      --glow-1: rgba(96, 165, 250, 0.14);\n      --glow-2: rgba(251, 146, 60, 0.16);\n      --button-grad-1: #f07b4d;\n      --button-grad-2: #f39a76;\n      --button-shadow: rgba(240, 123, 77, 0.16);\n      --button-shadow-hover: rgba(240, 123, 77, 0.2);\n      --pulse: rgba(255, 138, 90, 0.65);\n      --pulse-ring: rgba(255, 138, 90, 0.5);\n    }\n  }\n\n  * {\n    margin: 0;\n    padding: 0;\n    box-sizing: border-box;\n  }\n\n  body {\n    font-family: \"IBM Plex Sans\", \"Inter\", -apple-system, system-ui, sans-serif;\n    color: var(--ink);\n    background: transparent;\n    width: 420px;\n    height: 250px;\n    margin: 0;\n    padding: 0 !important;\n  }\n\n  #app {\n    background: var(--card);\n    position: relative;\n    overflow: hidden;\n    display: flex;\n    flex-direction: column;\n    min-height: 100%;\n    padding: 24px 24px 20px;\n    gap: 14px;\n    justify-content: center;\n  }\n\n  #app::before {\n    content: \"\";\n    position: absolute;\n    inset: 0;\n    background:\n      radial-gradient(240px 140px at 100% 0%, var(--glow-1), transparent 70%),\n      radial-gradient(220px 140px at 0% 100%, var(--glow-2), transparent 70%);\n    pointer-events: none;\n  }\n\n  .header {\n    position: relative;\n    display: flex;\n    flex-direction: column;\n    gap: 6px;\n    align-items: flex-start;\n    padding-right: 96px;\n  }\n\n  .header-text {\n    display: flex;\n    flex-direction: column;\n    gap: 4px;\n  }\n\n  .badge {\n    display: inline-flex;\n    align-items: center;\n    gap: 8px;\n    font-size: 10px;\n    letter-spacing: 0.08em;\n    text-transform: uppercase;\n    color: var(--muted);\n    background: var(--badge-bg);\n    border-radius: 999px;\n    padding: 6px 10px;\n    white-space: nowrap;\n    position: absolute;\n    top: 0;\n    right: 0;\n  }\n\n  .pulse {\n    width: 8px;\n    height: 8px;\n    border-radius: 50%;\n    background: var(--accent);\n    box-shadow: 0 0 0 0 var(--pulse);\n    animation: pulse 1.6s ease-in-out infinite;\n  }\n\n  h1 {\n    font-size: clamp(18px, 4vw, 22px);\n    letter-spacing: -0.02em;\n    line-height: 1.25;\n  }\n\n  p {\n    margin: 0;\n    color: var(--muted);\n    font-size: 13px;\n    line-height: 1.6;\n  }\n\n  .subtle {\n    color: var(--muted-subtle);\n    font-size: 12px;\n  }\n\n  a {\n    color: var(--accent-2);\n    text-decoration: none;\n    border-bottom: 1px dashed var(--link-underline);\n  }\n\n  .content {\n    display: flex;\n    flex-direction: column;\n    gap: 10px;\n  }\n\n  .footer {\n    display: flex;\n    flex-direction: column;\n    gap: 10px;\n    align-items: center;\n  }\n\n  .actions {\n    display: flex;\n    flex-wrap: wrap;\n    gap: 12px;\n    justify-content: center;\n  }\n\n  button {\n    appearance: none;\n    border: none;\n    border-radius: 999px;\n    background: linear-gradient(135deg, var(--button-grad-1), var(--button-grad-2));\n    color: white;\n    padding: 8px 14px;\n    font-size: 12px;\n    font-weight: 600;\n    cursor: pointer;\n    box-shadow: 0 8px 16px var(--button-shadow);\n    transition: transform 160ms ease, box-shadow 160ms ease;\n  }\n\n  button:hover {\n    transform: translateY(-1px);\n    box-shadow: 0 10px 20px var(--button-shadow-hover);\n  }\n\n  button:focus-visible {\n    outline: 2px solid var(--accent-2);\n    outline-offset: 2px;\n  }\n\n  .hint {\n    font-size: 11px;\n    color: var(--muted-hint);\n    text-align: center;\n  }\n\n  @keyframes pulse {\n    0% { box-shadow: 0 0 0 0 var(--pulse-ring); }\n    70% { box-shadow: 0 0 0 10px rgba(255, 107, 44, 0); }\n    100% { box-shadow: 0 0 0 0 rgba(255, 107, 44, 0); }\n  }\n</style>\n\n<div id=\"app\">\n  <div class=\"header\">\n    <span class=\"badge\"><span class=\"pulse\"></span>dev server</span>\n    <div class=\"header-text\">\n      <h1>CRXJS DEV MODE</h1>\n      <p class=\"subtle\">Connecting to the Vite dev server\\u2026</p>\n    </div>\n  </div>\n\n  <div class=\"content\">\n    <p>\n      Cannot connect to <a href=\"${VITE_PAGE_URL}\">${VITE_PAGE_URL}</a>.\n      Make sure Vite is running, then reload the extension.\n    </p>\n    <p>This page will close automatically after the extension reloads.</p>\n  </div>\n\n  <div class=\"footer\">\n    <div class=\"actions\">\n      <button>Reload Extension</button>\n    </div>\n    <div class=\"hint\">Tip: if the URL is wrong, restart Vite so it picks the right port.</div>\n  </div>\n</div>\n`;\ndocument.body.querySelector(\"button\")?.addEventListener(\"click\", () => {\n  chrome.runtime.reload();\n});\nlet tries = 0;\nlet ready = false;\ndo {\n  try {\n    const response = await fetch(getReadyUrl());\n    if (!response.ok)\n      throw new Error(`HTTP ${response.status}`);\n    ready = true;\n  } catch {\n    const timeout = Math.min(100 * Math.pow(2, ++tries), 5e3);\n    console.log(`[CRXJS] Vite Dev Server is not available on ${VITE_PAGE_URL}`);\n    console.log(`[CRXJS] Retrying in ${timeout}ms...`);\n    await new Promise((resolve) => setTimeout(resolve, timeout));\n  }\n} while (!ready);\nconsole.log(`[CRXJS] Vite Dev Server is ready on ${VITE_PAGE_URL}`);\nconsole.log(`[CRXJS] Reloading in ${RELOAD_DELAY}ms...`);\nawait new Promise((resolve) => setTimeout(resolve, RELOAD_DELAY));\nlocation.reload();\n";
 
 var loadingPageHtml = "<!DOCTYPE html>\n<html lang=\"en\">\n  <head>\n    <title>CRXJS DEV MODE</title>\n    <script src=\"%SCRIPT%\" type=\"module\"></script>\n  </head>\n  <body>\n    <p>An unknown error occurred. Failed to load the script.</p>\n  </body>\n</html>\n";
 
 const { readFile } = promises;
+const loadingPageReadyPath = "/@crx/dev-ready";
+function normalizeHtmlPath(pathname) {
+  let decoded;
+  try {
+    decoded = decodeURIComponent(pathname);
+  } catch {
+    return null;
+  }
+  const normalized = normalize(decoded.replace(/^\/+/, "") || "index.html");
+  if (normalized.startsWith("..") || isAbsolute(normalized))
+    return null;
+  return normalized;
+}
+function getLoadingPageReadyHtmlPath(requestUrl) {
+  if (!requestUrl)
+    return null;
+  let url;
+  try {
+    url = new URL(requestUrl, "http://crxjs.local");
+  } catch {
+    return null;
+  }
+  if (url.pathname !== loadingPageReadyPath)
+    return void 0;
+  const path = url.searchParams.get("path");
+  if (!path)
+    return null;
+  let pageUrl;
+  try {
+    pageUrl = new URL(path, "http://crxjs.local");
+  } catch {
+    return null;
+  }
+  return normalizeHtmlPath(pageUrl.pathname);
+}
 const pluginManifest = () => {
   let manifest;
   let plugins = [];
+  let devHtmlFiles = /* @__PURE__ */ new Set();
   let refId;
   let config;
   return [
@@ -1641,6 +2206,7 @@ const pluginManifest = () => {
             background: sw,
             html
           } = await manifestFiles(manifest, { cwd: config2.root });
+          devHtmlFiles = new Set(html.map(normalizeHtmlPath).filter(isString));
           const { entries = [] } = config2.optimizeDeps ?? {};
           let { input = [] } = config2.build?.rollupOptions ?? {};
           if (typeof input === "string")
@@ -1674,6 +2240,25 @@ const pluginManifest = () => {
           plugins = resolvedConfig.plugins;
         }
       },
+      configureServer(server) {
+        server.middlewares.use((req, res, next) => {
+          const htmlPath = getLoadingPageReadyHtmlPath(req.url);
+          if (typeof htmlPath === "undefined") {
+            next();
+            return;
+          }
+          res.setHeader("Access-Control-Allow-Origin", "*");
+          res.setHeader("Access-Control-Allow-Methods", "GET");
+          if (!htmlPath) {
+            res.statusCode = 400;
+            res.end();
+            return;
+          }
+          const exists = devHtmlFiles.has(htmlPath) && (existsSync(join(server.config.root, htmlPath)) || existsSync(join(server.config.publicDir, htmlPath)));
+          res.statusCode = exists ? 204 : 404;
+          res.end();
+        });
+      },
       buildStart(options) {
         if (options.plugins)
           plugins = options.plugins;
@@ -1810,14 +2395,27 @@ const pluginManifest = () => {
               }
             }
         } else {
+          const opts = await getOptions({ plugins: config.plugins });
+          const standaloneFiles = (opts.contentScripts?.standaloneFiles || []).map(
+            (f) => f.replace(/^\//, "")
+          );
+          const isStandaloneFile = (file) => {
+            const normalized = file.replace(/^\//, "");
+            return standaloneFiles.includes(normalized);
+          };
           if (manifest2.content_scripts)
             for (const { js = [], matches = [] } of manifest2.content_scripts)
               for (const file of js) {
+                if (isIifeContentScript(file) || isStandaloneFile(file))
+                  continue;
                 const id2 = join(config.root, file);
                 const refId2 = this.emitFile({
                   type: "chunk",
                   id: id2,
-                  name: basename(file)
+                  name: basename(file),
+                  // Preserve content script entry exports so the build finalizer
+                  // can decide whether the script needs a loader wrapper.
+                  preserveSignature: "exports-only"
                 });
                 contentScripts.set(
                   file,
@@ -1887,6 +2485,7 @@ const pluginManifest = () => {
             }
           }
         } else {
+          finalizeBuildContentScripts(this, bundle);
           if (manifest2.background && "service_worker" in manifest2.background) {
             const ref = manifest2.background.service_worker;
             const name = this.getFileName(ref);
@@ -1901,7 +2500,7 @@ const pluginManifest = () => {
             ({ js = [], ...rest }) => {
               return {
                 js: js.map((id) => {
-                  const script = contentScripts.get(id);
+                  const script = contentScripts.get(id) ?? contentScripts.get(prefix$1("/", id));
                   const fileName = script?.loaderName ?? script?.fileName;
                   if (typeof fileName === "undefined")
                     throw new Error(
@@ -1941,6 +2540,11 @@ const pluginManifest = () => {
           "webAccessibleResources"
         ];
         const files = await manifestFiles(manifest2, { cwd: config.root });
+        if (config.command === "serve") {
+          devHtmlFiles = new Set(
+            files.html.map(normalizeHtmlPath).filter(isString)
+          );
+        }
         await Promise.all(
           assetTypes.map((k) => files[k]).flat().map(async (f) => {
             if (typeof bundle[f] === "undefined") {
@@ -1972,7 +2576,7 @@ Public dir: "${config.publicDir}"`
           const refId2 = this.emitFile({
             type: "asset",
             name: "loading-page.js",
-            source: loadingPageScript.replace("%PROTO%", config.server.https ? "https" : "http").replace("%PORT%", `${config.server.port ?? 0}`)
+            source: loadingPageScript.replace("%PROTO%", config.server.https ? "https" : "http").replace("%PORT%", `${config.server.port ?? 0}`).replace("%READY_PATH%", loadingPageReadyPath)
           });
           const loadingPageScriptName = this.getFileName(refId2);
           files.html.map(
@@ -2266,6 +2870,9 @@ const crx = (options) => {
   contentScripts.clear();
   return [
     pluginOptionsProvider(options),
+    pluginExtensionCors(),
+    pluginContentScriptsIife(),
+    // Must come early so isIifeModeEnabled is set before manifest plugin
     pluginBackground(),
     pluginContentScripts(),
     pluginDeclaredContentScripts(),