wxt 0.2.5 → 0.3.0

package/dist/index.d.ts

@@ -15,14 +15,14 @@ interface InlineConfig {
      * directory.
      *
      * @default
-     * "<root>"
+     * "<rootDir>"
      */
     srcDir?: string;
     /**
      * Directory containing files that will be copied to the output directory as-is.
      *
      * @default
-     * "<srcDir>/publicDir"
+     * "<rootDir>/publicDir"
      */
     publicDir?: string;
     /**
@@ -404,7 +404,7 @@ interface ExtensionRunnerConfig {
 
 type EntrypointGroup = Entrypoint | Entrypoint[];
 
-var version = "0.2.5";
+var version = "0.3.0";
 
 declare function defineConfig(config: UserConfig): UserConfig;
 
@@ -414,6 +414,10 @@ declare function defineRunnerConfig(config: ExtensionRunnerConfig): ExtensionRun
  * Bundles the extension for production. Returns a promise of the build result.
  */
 declare function build(config: InlineConfig): Promise<BuildOutput>;
+/**
+ * Creates a dev server, pre-builds all the files that need to exist to load the extension, and open
+ * the browser with the extension installed.
+ */
 declare function createServer(config?: InlineConfig): Promise<WxtDevServer>;
 
 export { BackgroundEntrypoint, BackgroundScriptDefintition, BaseEntrypoint, BuildOutput, BuildStepOutput, ConfigEnv, ContentScriptDefinition, ContentScriptEntrypoint, Entrypoint, ExtensionRunnerConfig, GenericEntrypoint, InlineConfig, Logger, OnContentScriptStopped, OptionsEntrypoint, PopupEntrypoint, TargetBrowser, TargetManifestVersion, UserConfig, UserManifest, UserManifestFn, WxtDevServer, WxtInlineViteConfig, build, createServer, defineConfig, defineRunnerConfig, version };

package/dist/index.js

@@ -1,20 +1,34 @@
 // src/core/utils/getInternalConfig.ts
 import path2, { resolve as resolve6 } from "node:path";
-import * as vite from "vite";
+import * as vite2 from "vite";
 import { consola } from "consola";
 
 // src/core/utils/entrypoints.ts
 import path, { relative, resolve } from "node:path";
+
+// src/core/utils/paths.ts
+import nodePath from "node:path";
+import * as vite from "vite";
+function normalizePath2(path5) {
+  return vite.normalizePath(path5);
+}
+function unnormalizePath(path5) {
+  return nodePath.normalize(path5);
+}
+
+// src/core/utils/entrypoints.ts
 function getEntrypointName(entrypointsDir, inputPath) {
   const relativePath = path.relative(entrypointsDir, inputPath);
-  const name = relativePath.split(/[\.\/]/, 2)[0];
+  const name = relativePath.split(/[\.\/\\]/, 2)[0];
   return name;
 }
 function getEntrypointOutputFile(entrypoint, ext) {
   return resolve(entrypoint.outputDir, `${entrypoint.name}${ext}`);
 }
 function getEntrypointBundlePath(entrypoint, outDir, ext) {
-  return relative(outDir, getEntrypointOutputFile(entrypoint, ext));
+  return normalizePath2(
+    relative(outDir, getEntrypointOutputFile(entrypoint, ext))
+  );
 }
 
 // src/core/vite-plugins/devHtmlPrerender.ts
@@ -176,7 +190,7 @@ function multipageMove(entrypoints, config) {
     async writeBundle(_, bundle) {
       for (const oldBundlePath in bundle) {
         const entrypoint = entrypoints.find(
-          (entry) => !!entry.inputPath.endsWith(oldBundlePath)
+          (entry) => !!normalizePath2(entry.inputPath).endsWith(oldBundlePath)
         );
         if (entrypoint == null) {
           config.logger.debug("No entrypoint found for", oldBundlePath);
@@ -217,11 +231,8 @@ import { mergeConfig } from "vite";
 function getUnimportOptions(config) {
   const defaultOptions = {
     debugLog: config.logger.debug,
-    imports: [
-      { name: "*", as: "browser", from: "webextension-polyfill" },
-      { name: "defineConfig", from: "wxt" }
-    ],
-    presets: [{ package: "wxt/client" }],
+    imports: [{ name: "defineConfig", from: "wxt" }],
+    presets: [{ package: "wxt/client" }, { package: "wxt/browser" }],
     warn: config.logger.warn,
     dirs: ["./components/*", "./composables/*", "./hooks/*", "./utils/*"]
   };
@@ -269,7 +280,7 @@ function virtualEntrypoin(type, config) {
       const index = id.indexOf(virtualId);
       if (index === -1)
         return;
-      const inputPath = id.substring(index + virtualId.length);
+      const inputPath = normalizePath2(id.substring(index + virtualId.length));
       return resolvedVirtualId + inputPath;
     },
     async load(id) {
@@ -350,7 +361,7 @@ function getGlobals(config) {
     {
       name: "__BROWSER__",
       value: config.browser,
-      type: `"chromium" | "firefox"`
+      type: `string`
     },
     {
       name: "__IS_CHROME__",
@@ -426,7 +437,7 @@ async function getInternalConfig(config, command) {
     });
     userConfig = loaded.config ?? {};
   }
-  const merged = vite.mergeConfig(
+  const merged = vite2.mergeConfig(
     baseConfig,
     userConfig
   );
@@ -435,13 +446,13 @@ async function getInternalConfig(config, command) {
     srcDir,
     userConfig.entrypointsDir ?? "entrypoints"
   );
-  const publicDir = resolve6(srcDir, userConfig.publicDir ?? "public");
+  const publicDir = resolve6(root, userConfig.publicDir ?? "public");
   const wxtDir = resolve6(srcDir, ".wxt");
   const typesDir = resolve6(wxtDir, "types");
   const env = { mode, browser, manifestVersion, command };
   const userManifest = await resolveManifestConfig(env, userConfig.manifest);
   const inlineManifest = await resolveManifestConfig(env, config.manifest);
-  const manifest = vite.mergeConfig(userManifest, inlineManifest);
+  const manifest = vite2.mergeConfig(userManifest, inlineManifest);
   const finalConfig = {
     ...merged,
     srcDir,
@@ -503,7 +514,7 @@ async function resolveManifestConfig(env, manifest) {
 
 // src/index.ts
 import pc3 from "picocolors";
-import * as vite5 from "vite";
+import * as vite6 from "vite";
 
 // src/core/utils/arrays.ts
 function every(array, predicate) {
@@ -576,11 +587,12 @@ function detectDevChanges(changedFiles, currentOutput) {
 }
 function findEffectedSteps(changedFile, currentOutput) {
   const changes = [];
-  const changedPath = changedFile[1];
+  const changedPath = normalizePath2(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`?
+    // fileName is normalized, relative bundle path
     chunk.type === "asset" && changedPath.endsWith(chunk.fileName) || // If it's a chunk that depends on the changed file, it is effected
+    // moduleIds are absolute, normalized paths
     chunk.type === "chunk" && chunk.moduleIds.includes(changedPath)
   );
   for (const step of currentOutput.steps) {
@@ -602,7 +614,7 @@ import { consola as consola2 } from "consola";
 import { relative as relative5 } from "node:path";
 
 // src/core/build/buildEntrypoints.ts
-import * as vite2 from "vite";
+import * as vite3 from "vite";
 
 // src/core/utils/removeEmptyDirs.ts
 import fs4 from "fs-extra";
@@ -623,9 +635,20 @@ async function removeEmptyDirs(dir) {
 }
 
 // src/core/build/buildEntrypoints.ts
-import glob from "fast-glob";
-import fs5 from "fs-extra";
+import fs6 from "fs-extra";
 import { dirname as dirname4, resolve as resolve7 } from "path";
+
+// src/core/utils/public.ts
+import fs5 from "fs-extra";
+import glob from "fast-glob";
+async function getPublicFiles(config) {
+  if (!await fs5.exists(config.publicDir))
+    return [];
+  const files = await glob("**/*", { cwd: config.publicDir });
+  return files.map(unnormalizePath);
+}
+
+// src/core/build/buildEntrypoints.ts
 async function buildEntrypoints(groups, config) {
   const steps = [];
   for (const group of groups) {
@@ -664,11 +687,11 @@ async function buildSingleEntrypoint(entrypoint, config) {
       }
     }
   };
-  const entryConfig = vite2.mergeConfig(
+  const entryConfig = vite3.mergeConfig(
     libMode,
     config.vite
   );
-  const result = await vite2.build(entryConfig);
+  const result = await vite3.build(entryConfig);
   return {
     entrypoints: entrypoint,
     chunks: getBuildOutputChunks(result)
@@ -694,11 +717,11 @@ async function buildMultipleEntrypoints(entrypoints, config) {
       }
     }
   };
-  const entryConfig = vite2.mergeConfig(
+  const entryConfig = vite3.mergeConfig(
     multiPage,
     config.vite
   );
-  const result = await vite2.build(entryConfig);
+  const result = await vite3.build(entryConfig);
   return {
     entrypoints,
     chunks: getBuildOutputChunks(result)
@@ -712,21 +735,21 @@ function getBuildOutputChunks(result) {
   return result.output;
 }
 async function copyPublicDirectory(config) {
+  const files = await getPublicFiles(config);
+  if (files.length === 0)
+    return [];
   const publicAssets = [];
-  if (!await fs5.exists(config.publicDir))
-    return publicAssets;
-  const files = await glob("**/*", { cwd: config.publicDir });
   for (const file of files) {
     const srcPath = resolve7(config.publicDir, file);
     const outPath = resolve7(config.outDir, file);
-    await fs5.ensureDir(dirname4(outPath));
-    await fs5.copyFile(srcPath, outPath);
+    await fs6.ensureDir(dirname4(outPath));
+    await fs6.copyFile(srcPath, outPath);
     publicAssets.push({
       type: "asset",
       fileName: file,
       name: file,
       needsCodeReference: false,
-      source: await fs5.readFile(srcPath)
+      source: await fs6.readFile(srcPath)
     });
   }
   return publicAssets;
@@ -734,7 +757,7 @@ async function copyPublicDirectory(config) {
 
 // src/core/build/findEntrypoints.ts
 import { relative as relative3, resolve as resolve9 } from "path";
-import fs7 from "fs-extra";
+import fs8 from "fs-extra";
 import picomatch from "picomatch";
 import { parseHTML as parseHTML2 } from "linkedom";
 import JSON5 from "json5";
@@ -742,7 +765,7 @@ import JSON5 from "json5";
 // src/core/utils/importTsFile.ts
 import createJITI from "jiti";
 import { createUnimport as createUnimport2 } from "unimport";
-import fs6 from "fs-extra";
+import fs7 from "fs-extra";
 import { resolve as resolve8 } from "path";
 import transform from "jiti/dist/babel";
 
@@ -757,14 +780,14 @@ function removeImportStatements(text) {
 // src/core/utils/importTsFile.ts
 async function importTsFile(path5, config) {
   config.logger.debug("Loading file metadata:", path5);
+  const normalPath = normalizePath2(path5);
   const unimport2 = createUnimport2({
     ...getUnimportOptions(config),
     // Only allow specific imports, not all from the project
-    imports: [{ name: "*", as: "browser", from: "webextension-polyfill" }],
     dirs: []
   });
   await unimport2.init();
-  const text = await fs6.readFile(path5, "utf-8");
+  const text = await fs7.readFile(path5, "utf-8");
   const textNoImports = removeImportStatements(text);
   const { code } = await unimport2.injectImports(textNoImports);
   config.logger.debug(
@@ -781,7 +804,7 @@ async function importTsFile(path5, config) {
       )
     },
     transform(opts) {
-      if (opts.filename === path5)
+      if (opts.filename === normalPath)
         return transform({ ...opts, source: code });
       else
         return transform(opts);
@@ -874,7 +897,7 @@ ${JSON.stringify(
 }
 async function getPopupEntrypoint(config, path5) {
   const options = {};
-  const content = await fs7.readFile(path5, "utf-8");
+  const content = await fs8.readFile(path5, "utf-8");
   const { document } = parseHTML2(content);
   const title = document.querySelector("title");
   if (title != null)
@@ -904,7 +927,7 @@ async function getPopupEntrypoint(config, path5) {
 }
 async function getOptionsEntrypoint(config, path5) {
   const options = {};
-  const content = await fs7.readFile(path5, "utf-8");
+  const content = await fs8.readFile(path5, "utf-8");
   const { document } = parseHTML2(content);
   const openInTabContent = document.querySelector("meta[name='manifest.open_in_tab']")?.getAttribute("content");
   if (openInTabContent) {
@@ -999,10 +1022,10 @@ var PATH_GLOB_TO_TYPE_MAP = {
 
 // src/core/build/generateTypesDir.ts
 import { createUnimport as createUnimport3 } from "unimport";
-import fs8 from "fs-extra";
+import fs9 from "fs-extra";
 import { relative as relative4, resolve as resolve10 } from "path";
 async function generateTypesDir(entrypoints, config) {
-  await fs8.ensureDir(config.typesDir);
+  await fs9.ensureDir(config.typesDir);
   const references = [];
   references.push(await writeImportsDeclarationFile(config));
   references.push(await writePathsDeclarationFile(entrypoints, config));
@@ -1014,7 +1037,7 @@ async function writeImportsDeclarationFile(config) {
   const filePath = resolve10(config.typesDir, "imports.d.ts");
   const unimport2 = createUnimport3(getUnimportOptions(config));
   await unimport2.scanImportsFromDir(void 0, { cwd: config.srcDir });
-  await fs8.writeFile(
+  await fs9.writeFile(
     filePath,
     ["// Generated by wxt", await unimport2.generateTypeDeclarations()].join(
       "\n"
@@ -1024,28 +1047,34 @@ async function writeImportsDeclarationFile(config) {
 }
 async function writePathsDeclarationFile(entrypoints, config) {
   const filePath = resolve10(config.typesDir, "paths.d.ts");
-  const unions = entrypoints.map((entry) => {
-    const path5 = getEntrypointBundlePath(
+  const unions = entrypoints.map(
+    (entry) => getEntrypointBundlePath(
       entry,
       config.outDir,
       entry.inputPath.endsWith(".html") ? ".html" : ".js"
-    );
-    return `  | "/${path5}"`;
-  }).sort();
-  await fs8.writeFile(
+    )
+  ).concat(await getPublicFiles(config)).map(normalizePath2).map((path5) => `    | "/${path5}"`).sort().join("\n");
+  const template = `// Generated by wxt
+import "wxt/browser";
+
+declare module "wxt/browser" {
+  type PublicPath =
+{{ union }}
+  export interface ProjectRuntime extends Runtime.Static {
+    getURL(path: PublicPath): string;
+  }
+}
+`;
+  await fs9.writeFile(
     filePath,
-    [
-      "// Generated by wxt",
-      "type EntrypointPath =",
-      ...unions.length === 0 ? ["  never"] : unions
-    ].join("\n") + "\n"
+    template.replace("{{ union }}", unions || "    | never")
   );
   return filePath;
 }
 async function writeGlobalsDeclarationFile(config) {
   const filePath = resolve10(config.typesDir, "globals.d.ts");
   const globals = getGlobals(config);
-  await fs8.writeFile(
+  await fs9.writeFile(
     filePath,
     [
       "// Generated by wxt",
@@ -1061,13 +1090,13 @@ async function writeGlobalsDeclarationFile(config) {
 async function writeMainDeclarationFile(references, config) {
   const dir = config.wxtDir;
   const filePath = resolve10(dir, "wxt.d.ts");
-  await fs8.writeFile(
+  await fs9.writeFile(
     filePath,
     [
       "// Generated by wxt",
       `/// <reference types="vite/client" />`,
       ...references.map(
-        (ref) => `/// <reference types="./${relative4(dir, ref)}" />`
+        (ref) => `/// <reference types="./${normalizePath2(relative4(dir, ref))}" />`
       )
     ].join("\n") + "\n"
   );
@@ -1075,7 +1104,7 @@ async function writeMainDeclarationFile(references, config) {
 }
 async function writeTsConfigFile(mainReference, config) {
   const dir = config.wxtDir;
-  await fs8.writeFile(
+  await fs9.writeFile(
     resolve10(dir, "tsconfig.json"),
     `{
   "compilerOptions": {
@@ -1086,37 +1115,32 @@ async function writeTsConfigFile(mainReference, config) {
     "esModuleInterop": true,
     "forceConsistentCasingInFileNames": true,
     "resolveJsonModule": true,
-
-    /* Type Checking */
     "strict": true,
-
-    /* Completeness */
+    "lib": ["DOM", "WebWorker"],
     "skipLibCheck": true,
-
-    /* Aliases */
-    "baseUrl": "${relative4(dir, config.root)}",
+    "baseUrl": "${normalizePath2(relative4(dir, config.root))}",
     "paths": {
       "@@": ["."],
       "@@/*": ["./*"],
       "~~": ["."],
       "~~/*": ["./*"],
-      "@": ["${relative4(config.root, config.srcDir)}"],
-      "@/*": ["${relative4(config.root, config.srcDir)}/*"],
-      "~": ["${relative4(config.root, config.srcDir)}"],
-      "~/*": ["${relative4(config.root, config.srcDir)}/*"]
+      "@": ["${normalizePath2(relative4(config.root, config.srcDir))}"],
+      "@/*": ["${normalizePath2(relative4(config.root, config.srcDir))}/*"],
+      "~": ["${normalizePath2(relative4(config.root, config.srcDir))}"],
+      "~/*": ["${normalizePath2(relative4(config.root, config.srcDir))}/*"]
     }
   },
   "include": [
-    "${relative4(dir, config.root)}/**/*",
-    "./${relative4(dir, mainReference)}"
+    "${normalizePath2(relative4(dir, config.root))}/**/*",
+    "./${normalizePath2(relative4(dir, mainReference))}"
   ],
-  "exclude": ["${relative4(dir, config.outBaseDir)}"]
+  "exclude": ["${normalizePath2(relative4(dir, config.outBaseDir))}"]
 }`
   );
 }
 
 // src/core/utils/manifest.ts
-import fs10 from "fs-extra";
+import fs11 from "fs-extra";
 import { resolve as resolve12 } from "path";
 
 // src/core/utils/ContentSecurityPolicy.ts
@@ -1202,11 +1226,11 @@ function mapWxtOptionsToContentScript(options) {
 
 // src/core/utils/package.ts
 import { resolve as resolve11 } from "node:path";
-import fs9 from "fs-extra";
+import fs10 from "fs-extra";
 async function getPackageJson(config) {
   const file = resolve11(config.root, "package.json");
   try {
-    return await fs9.readJson(file);
+    return await fs10.readJson(file);
   } catch (err) {
     config.logger.debug(
       `Failed to read package.json at: ${file}. Returning undefined.`
@@ -1218,8 +1242,8 @@ async function getPackageJson(config) {
 // 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 fs10.ensureDir(config.outDir);
-  await fs10.writeFile(resolve12(config.outDir, "manifest.json"), str, "utf-8");
+  await fs11.ensureDir(config.outDir);
+  await fs11.writeFile(resolve12(config.outDir, "manifest.json"), str, "utf-8");
   output.publicAssets.unshift({
     type: "asset",
     fileName: "manifest.json",
@@ -1500,8 +1524,8 @@ function addHostPermission(manifest, hostPermission) {
 
 // src/core/build.ts
 import pc2 from "picocolors";
-import * as vite3 from "vite";
-import fs12 from "fs-extra";
+import * as vite4 from "vite";
+import fs13 from "fs-extra";
 
 // src/core/utils/groupEntrypoints.ts
 function groupEntrypoints(entrypoints) {
@@ -1554,7 +1578,7 @@ import { resolve as resolve13 } from "path";
 // src/core/log/printFileList.ts
 import path4 from "node:path";
 import pc from "picocolors";
-import fs11 from "fs-extra";
+import fs12 from "fs-extra";
 import { filesize } from "filesize";
 
 // src/core/log/printTable.ts
@@ -1594,7 +1618,7 @@ async function printFileList(log, baseDir, files) {
       ];
       const prefix = i === files.length - 1 ? "  \u2514\u2500" : "  \u251C\u2500";
       const color = getChunkColor(file);
-      const stats = await fs11.lstat(file);
+      const stats = await fs12.lstat(file);
       totalSize += stats.size;
       const size = String(filesize(stats.size));
       return [
@@ -1654,12 +1678,12 @@ async function buildInternal(config) {
   const target = `${config.browser}-mv${config.manifestVersion}`;
   config.logger.info(
     `${verb} ${pc2.cyan(target)} for ${pc2.cyan(config.mode)} with ${pc2.green(
-      `Vite ${vite3.version}`
+      `Vite ${vite4.version}`
     )}`
   );
   const startTime = Date.now();
-  await fs12.rm(config.outDir, { recursive: true, force: true });
-  await fs12.ensureDir(config.outDir);
+  await fs13.rm(config.outDir, { recursive: true, force: true });
+  await fs13.ensureDir(config.outDir);
   const entrypoints = await findEntrypoints(config);
   const groups = groupEntrypoints(entrypoints);
   const { output } = await rebuild(config, groups, void 0);
@@ -1708,7 +1732,7 @@ async function rebuild(config, entrypointGroups, existingOutput = {
 }
 
 // src/core/server.ts
-import * as vite4 from "vite";
+import * as vite5 from "vite";
 
 // src/core/runners/createWebExtRunner.ts
 function createWebExtRunner() {
@@ -1787,8 +1811,8 @@ async function getServerInfo() {
 }
 async function setupServer(serverInfo, config) {
   const runner = createWebExtRunner();
-  const viteServer = await vite4.createServer(
-    vite4.mergeConfig(serverInfo, config.vite)
+  const viteServer = await vite5.createServer(
+    vite5.mergeConfig(serverInfo, config.vite)
   );
   const start = async () => {
     await viteServer.listen(server.port);
@@ -1854,7 +1878,7 @@ function reloadHtmlPages(groups, server, config) {
 }
 
 // package.json
-var version2 = "0.2.5";
+var version2 = "0.3.0";
 
 // src/core/utils/defineConfig.ts
 function defineConfig(config) {
@@ -1874,7 +1898,7 @@ async function build2(config) {
 async function createServer2(config) {
   const serverInfo = await getServerInfo();
   const getLatestInternalConfig = () => {
-    const viteConfig = vite5.mergeConfig(
+    const viteConfig = vite6.mergeConfig(
       serverInfo.viteServerConfig,
       config?.vite ?? {}
     );