wxt 0.19.22 → 0.20.0-beta1

package/README.md

@@ -76,6 +76,12 @@ Or see the [installation guide](https://wxt.dev/guide/installation.html) to get
 - 📏 Bundle analysis
 - ⬇️ Download and bundle remote URL imports
 
+## Sponsors
+
+WXT is a [MIT-licensed](https://github.com/wxt-dev/wxt/blob/main/LICENSE) open source project with its ongoing development made possible entirely by the support of these awesome backers. If you'd like to join them, please consider [sponsoring WXT's development](https://github.com/sponsors/wxt-dev).
+
+<a href="https://github.com/sponsors/wxt-dev"><img alt="WXT Sponsors" src="https://raw.githubusercontent.com/wxt-dev/static/refs/heads/main/sponsorkit/sponsors.svg"></a>
+
 ## Contributors
 
 <!-- automd:contributors author="aklinker1" license="MIT" github="wxt-dev/wxt" -->

package/dist/browser.d.ts

@@ -0,0 +1,28 @@
+/**
+ * Contains the `browser` export which you should use to access the extension APIs in your project:
+ * ```ts
+ * import { browser } from 'wxt/browser';
+ *
+ * browser.runtime.onInstalled.addListener(() => {
+ *   // ...
+ * })
+ * ```
+ * @module wxt/browser
+ */
+/**
+ * This interface is empty because it is generated per-project when running `wxt prepare`. See:
+ * - `.wxt/types/paths.d.ts`
+ */
+export interface WxtRuntime {
+}
+/**
+ * This interface is empty because it is generated per-project when running `wxt prepare`. See:
+ * - `.wxt/types/i18n.d.ts`
+ */
+export interface WxtI18n {
+}
+export type WxtBrowser = Omit<typeof chrome, 'runtime' | 'i18n'> & {
+    runtime: WxtRuntime & Omit<(typeof chrome)['runtime'], 'getURL'>;
+    i18n: WxtI18n & Omit<(typeof chrome)['i18n'], 'getMessage'>;
+};
+export declare const browser: WxtBrowser;

package/dist/builtin-modules/unimport.d.ts

@@ -3,6 +3,6 @@ import { type Unimport } from 'unimport';
 import { Plugin } from 'vite';
 declare const _default: WxtModule<import("../types").WxtModuleOptions>;
 export default _default;
-export declare function vitePlugin(unimport: Unimport): Plugin;
+export declare function vitePlugin(unimport: Unimport, autoImportsEnabled: boolean): Plugin;
 export declare function getEslint8ConfigEntry(options: WxtResolvedUnimportOptions, globals: Record<string, EslintGlobalsPropValue>): WxtDirFileEntry;
 export declare function getEslint9ConfigEntry(options: WxtResolvedUnimportOptions, globals: Record<string, EslintGlobalsPropValue>): WxtDirFileEntry;

package/dist/builtin-modules/unimport.mjs

@@ -1,40 +1,45 @@
 import { addViteConfig, defineWxtModule } from "../modules.mjs";
-import { createUnimport } from "unimport";
+import { createUnimport, toExports } from "unimport";
 import { extname } from "node:path";
 export default defineWxtModule({
   name: "wxt:built-in:unimport",
   setup(wxt) {
-    const options = wxt.config.imports;
-    if (options === false) return;
     let unimport;
+    const isEnabled = () => !wxt.config.imports.disabled;
     wxt.hooks.hook("config:resolved", () => {
       const addModuleImports = (module) => {
         if (!module.imports) return;
-        options.imports ??= [];
-        options.imports.push(...module.imports);
+        wxt.config.imports.imports ??= [];
+        wxt.config.imports.imports.push(...module.imports);
       };
       wxt.config.builtinModules.forEach(addModuleImports);
       wxt.config.userModules.forEach(addModuleImports);
     });
     wxt.hooks.afterEach((event) => {
       if (event.name === "config:resolved") {
-        unimport = createUnimport(options);
+        unimport = createUnimport(wxt.config.imports);
       }
     });
     wxt.hooks.hook("prepare:types", async (_, entries) => {
       await unimport.init();
+      entries.push(await getImportsModuleEntry(wxt, unimport));
+      if (!isEnabled()) return;
       entries.push(await getImportsDeclarationEntry(unimport));
-      if (options.eslintrc.enabled === false) return;
+      if (wxt.config.imports.eslintrc.enabled === false) return;
       entries.push(
-        await getEslintConfigEntry(unimport, options.eslintrc.enabled, options)
+        await getEslintConfigEntry(
+          unimport,
+          wxt.config.imports.eslintrc.enabled,
+          wxt.config.imports
+        )
       );
     });
     addViteConfig(wxt, () => ({
-      plugins: [vitePlugin(unimport)]
+      plugins: [vitePlugin(unimport, isEnabled())]
     }));
   }
 });
-export function vitePlugin(unimport) {
+export function vitePlugin(unimport, autoImportsEnabled) {
   const ENABLED_EXTENSIONS = /* @__PURE__ */ new Set([
     ".js",
     ".jsx",
@@ -48,7 +53,12 @@ export function vitePlugin(unimport) {
     async transform(code, id) {
       if (id.includes("node_modules")) return;
       if (!ENABLED_EXTENSIONS.has(extname(id))) return;
-      const injected = await unimport.injectImports(code, id);
+      const injected = await unimport.injectImports(code, id, {
+        // Only auto-import modules if enabled
+        autoImport: autoImportsEnabled,
+        // Always resolve the #imports module, even when auto-imports are disabled
+        transformVirtualImports: true
+      });
       return {
         code: injected.code,
         map: injected.s.generateMap({ hires: "boundary", source: id })
@@ -57,7 +67,6 @@ export function vitePlugin(unimport) {
   };
 }
 async function getImportsDeclarationEntry(unimport) {
-  await unimport.init();
   return {
     path: "types/imports.d.ts",
     text: [
@@ -68,6 +77,21 @@ async function getImportsDeclarationEntry(unimport) {
     tsReference: true
   };
 }
+async function getImportsModuleEntry(wxt, unimport) {
+  const imports = await unimport.getImports();
+  return {
+    path: "types/imports-module.d.ts",
+    text: [
+      "// Generated by wxt",
+      "// Types for the #import virtual module",
+      "declare module '#imports' {",
+      `  ${toExports(imports, wxt.config.wxtDir, true).replaceAll("\n", "\n  ")}`,
+      "}",
+      ""
+    ].join("\n"),
+    tsReference: true
+  };
+}
 async function getEslintConfigEntry(unimport, version, options) {
   const globals = (await unimport.getImports()).map((i) => i.as ?? i.name).filter(Boolean).sort().reduce((globals2, name) => {
     globals2[name] = options.eslintrc.globalsPropValue;

package/dist/cli/index.mjs

@@ -1,7 +1,6 @@
 import cli from "./commands.mjs";
 import { version } from "../version.mjs";
 import { isAliasedCommand } from "./cli-utils.mjs";
-process.env.VITE_CJS_IGNORE_WARNING = "true";
 cli.parse(process.argv, { run: false });
 if (!isAliasedCommand(cli.matchedCommand)) {
   cli.help();

package/dist/core/builders/vite/index.mjs

@@ -5,7 +5,6 @@ import {
 } from "../../utils/entrypoints.mjs";
 import { toArray } from "../../utils/arrays.mjs";
 import { safeVarName } from "../../utils/strings.mjs";
-import { importEntrypointFile } from "../../utils/building/index.mjs";
 import { ViteNodeServer } from "vite-node/server";
 import { ViteNodeRunner } from "vite-node/client";
 import { installSourcemapsSupport } from "vite-node/source-map";
@@ -45,7 +44,6 @@ export async function createViteBuilder(wxtConfig, hooks, getWxtDevServer) {
       wxtPlugins.tsconfigPaths(wxtConfig),
       wxtPlugins.noopBackground(),
       wxtPlugins.globals(wxtConfig),
-      wxtPlugins.resolveExtensionApi(wxtConfig),
       wxtPlugins.defineImportMeta(),
       wxtPlugins.wxtPluginLoader(wxtConfig),
       wxtPlugins.resolveAppConfig(wxtConfig)
@@ -214,44 +212,26 @@ export async function createViteBuilder(wxtConfig, hooks, getWxtDevServer) {
     version: vite.version,
     async importEntrypoint(path) {
       const env = createExtensionEnvironment();
-      switch (wxtConfig.entrypointLoader) {
-        default:
-        case "jiti": {
-          return await env.run(() => importEntrypointFile(path));
-        }
-        case "vite-node": {
-          const { runner, server } = await createViteNodeImporter([path]);
-          const res = await env.run(() => runner.executeFile(path));
-          await server.close();
-          requireDefaultExport(path, res);
-          return res.default;
-        }
-      }
+      const { runner, server } = await createViteNodeImporter([path]);
+      const res = await env.run(() => runner.executeFile(path));
+      await server.close();
+      requireDefaultExport(path, res);
+      return res.default;
     },
     async importEntrypoints(paths) {
       const env = createExtensionEnvironment();
-      switch (wxtConfig.entrypointLoader) {
-        default:
-        case "jiti": {
-          return await env.run(
-            () => Promise.all(paths.map(importEntrypointFile))
-          );
-        }
-        case "vite-node": {
-          const { runner, server } = await createViteNodeImporter(paths);
-          const res = await env.run(
-            () => Promise.all(
-              paths.map(async (path) => {
-                const mod = await runner.executeFile(path);
-                requireDefaultExport(path, mod);
-                return mod.default;
-              })
-            )
-          );
-          await server.close();
-          return res;
-        }
-      }
+      const { runner, server } = await createViteNodeImporter(paths);
+      const res = await env.run(
+        () => Promise.all(
+          paths.map(async (path) => {
+            const mod = await runner.executeFile(path);
+            requireDefaultExport(path, mod);
+            return mod.default;
+          })
+        )
+      );
+      await server.close();
+      return res;
     },
     async build(group) {
       let entryConfig;
@@ -302,7 +282,10 @@ export async function createViteBuilder(wxtConfig, hooks, getWxtDevServer) {
             viteServer.ws.on(message, cb);
           }
         },
-        watcher: viteServer.watcher
+        watcher: viteServer.watcher,
+        on(event, cb) {
+          viteServer.httpServer?.on(event, cb);
+        }
       };
       return server;
     }

package/dist/core/builders/vite/plugins/extensionApiMock.d.ts

@@ -1,11 +1,6 @@
 import type * as vite from 'vite';
 import { ResolvedConfig } from '../../../../types';
 /**
- * Mock `webextension-polyfill`, `wxt/browser`, and `wxt/browser/*` by inlining
- * all dependencies that import them and adding a custom alias so that Vite
- * resolves to a mocked version of the module.
- *
- * TODO: Detect non-wxt dependencies (like `@webext-core/*`) that import `webextension-polyfill` via
- * `npm list` and inline them automatically.
+ * Mock `wxt/browser` and stub the global `browser`/`chrome` types with a fake version of the extension APIs
  */
 export declare function extensionApiMock(config: ResolvedConfig): vite.PluginOption;

package/dist/core/builders/vite/plugins/extensionApiMock.mjs

@@ -15,14 +15,12 @@ export function extensionApiMock(config) {
         },
         resolve: {
           alias: [
-            { find: "webextension-polyfill", replacement },
             // wxt/browser, wxt/browser/...
-            { find: /^wxt\/browser.*/, replacement }
+            { find: "wxt/browser", replacement }
           ]
         },
         ssr: {
-          // Inline all WXT modules so vite processes them so the aliases can
-          // be resolved
+          // Inline all WXT modules subdependencies can be mocked
           noExternal: ["wxt"]
         }
       };

package/dist/core/builders/vite/plugins/index.d.ts

@@ -9,7 +9,6 @@ export * from './cssEntrypoints';
 export * from './bundleAnalysis';
 export * from './globals';
 export * from './extensionApiMock';
-export * from './resolveExtensionApi';
 export * from './entrypointGroupGlobals';
 export * from './defineImportMeta';
 export * from './removeEntrypointMainFunction';

package/dist/core/builders/vite/plugins/index.mjs

@@ -9,7 +9,6 @@ export * from "./cssEntrypoints.mjs";
 export * from "./bundleAnalysis.mjs";
 export * from "./globals.mjs";
 export * from "./extensionApiMock.mjs";
-export * from "./resolveExtensionApi.mjs";
 export * from "./entrypointGroupGlobals.mjs";
 export * from "./defineImportMeta.mjs";
 export * from "./removeEntrypointMainFunction.mjs";

package/dist/core/builders/vite/plugins/noopBackground.mjs

@@ -9,7 +9,7 @@ export function noopBackground() {
     },
     load(id) {
       if (id === resolvedVirtualModuleId) {
-        return `import { defineBackground } from 'wxt/sandbox';
+        return `import { defineBackground } from 'wxt/utils/define-background';
 export default defineBackground(() => void 0)`;
       }
     }

package/dist/core/create-server.mjs

@@ -124,6 +124,7 @@ async function createServerInternal() {
     }
     await runner.openBrowser();
   };
+  builderServer.on?.("close", () => keyboardShortcuts.stop());
   return server;
 }
 function createFileReloader(server) {

package/dist/core/define-web-ext-config.d.ts

@@ -0,0 +1,9 @@
+import { WebExtConfig } from '../types';
+/**
+ * @deprecated Use `defineWebExtConfig` instead. Same function, different name.
+ */
+export declare function defineRunnerConfig(config: WebExtConfig): WebExtConfig;
+/**
+ * Configure how [`web-ext`](https://github.com/mozilla/web-ext) starts the browser during development.
+ */
+export declare function defineWebExtConfig(config: WebExtConfig): WebExtConfig;

package/dist/core/define-web-ext-config.mjs

@@ -0,0 +1,10 @@
+import consola from "consola";
+export function defineRunnerConfig(config) {
+  consola.warn(
+    "`defineRunnerConfig` is deprecated, use `defineWebExtConfig` instead. See https://wxt.dev/guide/resources/upgrading.html#v0-19-0-rarr-v0-20-0"
+  );
+  return defineWebExtConfig(config);
+}
+export function defineWebExtConfig(config) {
+  return config;
+}

package/dist/core/generate-wxt-dir.mjs

@@ -19,9 +19,7 @@ export async function generateWxtDir(entrypoints) {
   entries.push(await getPathsDeclarationEntry(entrypoints));
   entries.push(await getI18nDeclarationEntry());
   entries.push(await getGlobalsDeclarationEntry());
-  if (wxt.config.extensionApi === "chrome") {
-    entries.push({ module: "@types/chrome" });
-  }
+  entries.push({ module: "@types/chrome" });
   entries.push(await getTsConfigEntry());
   await wxt.hooks.callHook("prepare:types", wxt, entries);
   entries.push(getMainDeclarationEntry(entries));
@@ -180,10 +178,10 @@ async function getTsConfigEntry() {
   const paths = Object.entries(wxt.config.alias).flatMap(([alias, absolutePath]) => {
     const aliasPath = getTsconfigPath(absolutePath);
     return [
-      `      "${alias}": ["${aliasPath}"]`,
-      `      "${alias}/*": ["${aliasPath}/*"]`
+      `"${alias}": ["${aliasPath}"]`,
+      `"${alias}/*": ["${aliasPath}/*"]`
     ];
-  }).join(",\n");
+  }).map((line) => `      ${line}`).join(",\n");
   const text = `{
   "compilerOptions": {
     "target": "ESNext",

package/dist/core/index.d.ts

@@ -1,7 +1,7 @@
 export * from './build';
 export * from './clean';
 export * from './define-config';
-export * from './define-runner-config';
+export * from './define-web-ext-config';
 export * from './create-server';
 export * from './initialize';
 export * from './prepare';

package/dist/core/index.mjs

@@ -1,7 +1,7 @@
 export * from "./build.mjs";
 export * from "./clean.mjs";
 export * from "./define-config.mjs";
-export * from "./define-runner-config.mjs";
+export * from "./define-web-ext-config.mjs";
 export * from "./create-server.mjs";
 export * from "./initialize.mjs";
 export * from "./prepare.mjs";

package/dist/core/initialize.mjs

@@ -5,7 +5,7 @@ import fs from "fs-extra";
 import path from "node:path";
 import pc from "picocolors";
 export async function initialize(options) {
-  consola.info("Initalizing new project");
+  consola.info("Initializing new project");
   const templates = await listTemplates();
   const defaultTemplate = templates.find(
     (template) => template.name === options.template?.toLowerCase().trim()
@@ -35,10 +35,7 @@ export async function initialize(options) {
           { title: pc.red("npm"), value: "npm" },
           { title: pc.yellow("pnpm"), value: "pnpm" },
           { title: pc.cyan("yarn"), value: "yarn" },
-          {
-            title: `${pc.magenta("bun")}${pc.gray(" (experimental)")}`,
-            value: "bun"
-          }
+          { title: pc.magenta("bun"), value: "bun" }
         ]
       }
     ],

package/dist/core/keyboard-shortcuts.mjs

@@ -2,7 +2,6 @@ import readline from "node:readline";
 import { wxt } from "./wxt.mjs";
 import pc from "picocolors";
 export function createKeyboardShortcuts(server) {
-  let isWatching = false;
   let rl;
   const handleInput = (line) => {
     if (line.trim() === "o") {
@@ -11,22 +10,17 @@ export function createKeyboardShortcuts(server) {
   };
   return {
     start() {
-      if (isWatching) return;
+      if (rl) return;
       rl = readline.createInterface({
         input: process.stdin,
         terminal: false
         // Don't intercept ctrl+C, ctrl+Z, etc
       });
       rl.on("line", handleInput);
-      isWatching = true;
     },
     stop() {
-      if (!isWatching) return;
-      if (rl) {
-        rl.close();
-        rl = void 0;
-      }
-      isWatching = false;
+      rl?.close();
+      rl = void 0;
     },
     printHelp(flags) {
       if (flags.canReopenBrowser) {