chore(release): v0.6.1

This closes #119

CHANGELOG.md

@@ -1,5 +1,48 @@
 # Changelog
 
+## v0.6.1
+
+[compare changes](https://github.com/wxt-dev/wxt/compare/v0.6.0...v0.6.1)
+
+### 🚀 Enhancements
+
+- Add `transformManifest` option ([#124](https://github.com/wxt-dev/wxt/pull/124))
+
+### 🩹 Fixes
+
+- Don't open browser during development when using WSL ([#123](https://github.com/wxt-dev/wxt/pull/123))
+
+### 📖 Documentation
+
+- Load extension details from CWS ([8e0a189](https://github.com/wxt-dev/wxt/commit/8e0a189))
+
+### ❤️ Contributors
+
+- Aaron <aaronklinker1@gmail.com>
+- Aaron Klinker <aaronklinker1@gmail.com>
+
+## v0.6.0
+
+[compare changes](https://github.com/wxt-dev/wxt/compare/v0.5.6...v0.6.0)
+
+### 🚀 Enhancements
+
+- Export `ContentScriptContext` from `wxt/client` ([1f448d1](https://github.com/wxt-dev/wxt/commit/1f448d1))
+- ⚠️  Require a function for `vite` configuration ([#121](https://github.com/wxt-dev/wxt/pull/121))
+
+### 🩹 Fixes
+
+- Use the same mode for each build step ([1f6a931](https://github.com/wxt-dev/wxt/commit/1f6a931))
+- Disable dev logs in production ([3f260ee](https://github.com/wxt-dev/wxt/commit/3f260ee))
+
+#### ⚠️ Breaking Changes
+
+- ⚠️  The `vite` config option must now be a function. If you were using an object before, change it from `vite: { ... }` to `vite: () => ({ ... })`. ([#121](https://github.com/wxt-dev/wxt/pull/121))
+
+### ❤️ Contributors
+
+- Aaron Klinker ([@aklinker1](https://github.com/aklinker1))
+
 ## v0.5.6
 
 [compare changes](https://github.com/wxt-dev/wxt/compare/v0.5.5...v0.5.6)
@@ -10,7 +53,7 @@
 
 ### ❤️ Contributors
 
-- Aaron <aaronklinker1@gmail.com>
+- Aaron Klinker ([@aklinker1](https://github.com/aklinker1))
 
 ## v0.5.5
 
@@ -22,7 +65,7 @@
 
 ### ❤️ Contributors
 
-- Aaron Klinker <aaronklinker1@gmail.com>
+- Aaron Klinker ([@aklinker1](https://github.com/aklinker1))
 
 ## v0.5.4
 
@@ -35,7 +78,7 @@
 
 ### ❤️ Contributors
 
-- Aaron Klinker <aaronklinker1@gmail.com>
+- Aaron Klinker ([@aklinker1](https://github.com/aklinker1))
 
 ## v0.5.3
 
@@ -51,8 +94,7 @@
 
 ### ❤️ Contributors
 
-- Aaron <aaronklinker1@gmail.com>
-- Aaron Klinker <aaronklinker1@gmail.com>
+- Aaron Klinker ([@aklinker1](https://github.com/aklinker1))
 
 ## v0.5.2
 
@@ -64,7 +106,7 @@
 
 ### ❤️ Contributors
 
-- Aaron <aaronklinker1@gmail.com>
+- Aaron Klinker ([@aklinker1](https://github.com/aklinker1))
 
 ## v0.5.1
 
@@ -81,8 +123,7 @@
 
 ### ❤️ Contributors
 
-- Aaron <aaronklinker1@gmail.com>
-- Aaron Klinker <aaronklinker1@gmail.com>
+- Aaron Klinker ([@aklinker1](https://github.com/aklinker1))
 
 ## v0.5.0
 

demo/src/entrypoints/background.ts

@@ -19,4 +19,6 @@ export default defineBackground(() => {
   browser.i18n.getMessage('hello', 'Aaron');
   browser.i18n.getMessage('bye', ['Aaron']);
   browser.i18n.getMessage('@@extension_id');
+
+  console.log('WXT MODE:', import.meta.env.MODE);
 });

demo/src/entrypoints/options/main.ts

@@ -3,3 +3,5 @@ import 'url:https://code.jquery.com/jquery-3.7.1.slim.min.js';
 console.log(browser.runtime.id);
 logId();
 console.log(2);
+
+console.log('WXT MODE:', import.meta.env.MODE);

demo/src/entrypoints/overlay.content/index.ts

@@ -5,10 +5,14 @@ export default defineContentScript({
   async main(ctx) {
     console.log(browser.runtime.id);
     logId();
+
+    console.log('WXT MODE:', import.meta.env.MODE);
+
     const n = (Math.random() * 100).toFixed(1);
     ctx.setInterval(() => {
       console.log(n, browser.runtime.id);
     }, 1e3);
+
     mountContentScriptUi();
   },
 });

docs/.vitepress/components/UsingWxtSection.vue

@@ -1,12 +1,11 @@
 <script lang="ts" setup>
-const extensions = [
-  {
-    name: 'GitHub: Better Line Counts',
-    description: 'Remove generated files from GitHub line counts.',
-    icon: 'https://lh3.googleusercontent.com/GcffNyCJaxT2G9dsQCJHhUEMlu_E0vEzph5cLPrQj7UHKat7QyCzGu69Dmp_DDUL8rY-bPMFJceQarS1wcqdwTalTg=s256',
-    link: 'https://chrome.google.com/webstore/detail/github-better-line-counts/ocfdgncpifmegplaglcnglhioflaimkd',
-  },
+import useListExtensionDetails from '../composables/useListExtensionDetails';
+
+const chromeExtensionIds = [
+  'ocfdgncpifmegplaglcnglhioflaimkd', // GitHub: Better Line Counts
 ];
+
+const { data } = useListExtensionDetails(chromeExtensionIds);
 </script>
 
 <template>
@@ -14,10 +13,14 @@ const extensions = [
     <div class="container">
       <h2>Who's Using WXT?</h2>
       <ul>
-        <li v-for="extension of extensions">
-          <img :src="extension.icon" :alt="`${extension.name} icon`" />
-          <a :href="extension.link" target="_blank">{{ extension.name }}</a>
-          <small>{{ extension.description }}</small>
+        <li v-for="extension of data">
+          <img
+            :src="extension.iconUrl"
+            :alt="`${extension.name} icon`"
+            referrerpolicy="no-referrer"
+          />
+          <a :href="extension.storeUrl" target="_blank">{{ extension.name }}</a>
+          <small>{{ extension.shortDescription }}</small>
         </li>
       </ul>
       <p>Open a PR to add your extension to the list!</p>
@@ -57,6 +60,7 @@ img {
   width: 96px;
   height: 96px;
   margin-bottom: 16px;
+  border-radius: 8px;
 }
 
 ul {

docs/.vitepress/composables/useListExtensionDetails.ts

@@ -0,0 +1,53 @@
+import { ref } from 'vue';
+
+export interface ChromeExtension {
+  id: string;
+  name: string;
+  iconUrl: string;
+  weeklyActiveUsers: number;
+  shortDescription: string;
+  storeUrl: string;
+}
+
+const operationName = 'WxtDocsUsedBy';
+const query = `query ${operationName}($ids:[String!]!) {
+  chromeExtensions(ids: $ids) {
+    id
+    name
+    iconUrl
+    weeklyActiveUsers
+    shortDescription
+    storeUrl
+  }
+}`;
+
+export default function (ids: string[]) {
+  const data = ref<ChromeExtension[]>();
+  const err = ref<unknown>();
+
+  fetch('https://queue.wxt.dev/api', {
+    method: 'POST',
+    body: JSON.stringify({
+      operationName,
+      query,
+      variables: { ids },
+    }),
+  })
+    .then(async (res) => {
+      const {
+        data: { chromeExtensions },
+      } = await res.json();
+      data.value = chromeExtensions;
+      err.value = undefined;
+    })
+    .catch((error) => {
+      console.error(error);
+      data.value = undefined;
+      err.value = error;
+    });
+
+  return {
+    data,
+    err,
+  };
+}

docs/get-started/installation.md

@@ -2,12 +2,6 @@
 
 Bootstrap a new project, start from scratch, or migrate an existing project.
 
-:::warning 🚧 WSL Support
-**_WXT does not support [Windows Subsystem for Linux](https://learn.microsoft.com/en-us/windows/wsl/) yet_**. See [Issue #55](https://github.com/wxt-dev/wxt/issues/55) to track progress.
-
-In the meantime, you can use `cmd` instead.
-:::
-
 ## Bootstrap Project
 
 :::code-group

docs/index.md

@@ -54,4 +54,6 @@ features:
     details: 'TODO: Tools for analyizing the final extension bundle.'
 ---
 
-<UsingWxtSection />
+<ClientOnly>
+  <UsingWxtSection />
+</ClientOnly>

e2e/tests/auto-imports.test.ts

@@ -16,6 +16,7 @@ describe('Auto Imports', () => {
           // Generated by wxt
           export {}
           declare global {
+            const ContentScriptContext: typeof import('wxt/client')['ContentScriptContext']
             const browser: typeof import('wxt/browser')['browser']
             const defineBackground: typeof import('wxt/client')['defineBackground']
             const defineConfig: typeof import('wxt')['defineConfig']

e2e/tests/manifest-content.test.ts

@@ -306,4 +306,29 @@ describe('Manifest Content', () => {
       js: ['content-scripts/one.js'],
     });
   });
+
+  it('should respect the transformManifest option', async () => {
+    const project = new TestProject();
+    project.addFile(
+      'wxt.config.ts',
+      `import { defineConfig } from 'wxt';
+      
+      export default defineConfig({
+        transformManifest(manifest) {
+          manifest.author = "Custom Author"
+        }
+      })`,
+    );
+
+    await project.build();
+
+    const output = await project.serializeFile(
+      '.output/chrome-mv3/manifest.json',
+    );
+    expect(output).toMatchInlineSnapshot(`
+      ".output/chrome-mv3/manifest.json
+      ----------------------------------------
+      {\\"manifest_version\\":3,\\"name\\":\\"E2E Extension\\",\\"description\\":\\"Example description\\",\\"version\\":\\"0.0.0\\",\\"version_name\\":\\"0.0.0-test\\",\\"author\\":\\"Custom Author\\"}"
+    `);
+  });
 });

package.json

@@ -1,7 +1,7 @@
 {
   "name": "wxt",
   "type": "module",
-  "version": "0.5.6",
+  "version": "0.6.1",
   "description": "Next gen framework for developing web extensions",
   "engines": {
     "node": ">=18.16.0",
@@ -77,6 +77,8 @@
     "fs-extra": "^11.1.1",
     "get-port": "^7.0.0",
     "giget": "^1.1.2",
+    "immer": "^10.0.2",
+    "is-wsl": "^3.0.0",
     "jiti": "^1.19.1",
     "json5": "^2.2.3",
     "linkedom": "^0.15.1",
@@ -94,7 +96,6 @@
     "@types/fs-extra": "^11.0.1",
     "@types/lodash.merge": "^4.6.7",
     "@types/node": "^20.4.5",
-    "@types/prettier": "^3.0.0",
     "@types/prompts": "^2.4.4",
     "@vitest/coverage-v8": "^0.34.1",
     "execa": "^7.2.0",
@@ -111,6 +112,7 @@
     "vitepress": "1.0.0-rc.10",
     "vitest": "^0.34.1",
     "vitest-mock-extended": "^1.1.4",
+    "vue": "^3.3.4",
     "webextension-polyfill": "^0.10.0"
   },
   "peerDependencies": {

pnpm-lock.yaml

@@ -44,6 +44,12 @@ importers:
       giget:
         specifier: ^1.1.2
         version: 1.1.2
+      immer:
+        specifier: ^10.0.2
+        version: 10.0.2
+      is-wsl:
+        specifier: ^3.0.0
+        version: 3.0.0
       jiti:
         specifier: ^1.19.1
         version: 1.19.1
@@ -90,9 +96,6 @@ importers:
       '@types/node':
         specifier: ^20.4.5
         version: 20.5.9
-      '@types/prettier':
-        specifier: ^3.0.0
-        version: 3.0.0
       '@types/prompts':
         specifier: ^2.4.4
         version: 2.4.4
@@ -141,6 +144,9 @@ importers:
       vitest-mock-extended:
         specifier: ^1.1.4
         version: 1.2.1(typescript@5.1.6)(vitest@0.34.3)
+      vue:
+        specifier: ^3.3.4
+        version: 3.3.4
 
   demo:
     dependencies:
@@ -1004,13 +1010,6 @@ packages:
   /@types/node@20.5.9:
     resolution: {integrity: sha512-PcGNd//40kHAS3sTlzKB9C9XL4K0sTup8nbG5lC14kzEteTNuAFh9u5nA0o5TWnSG2r/JNPRXFVcHJIIeRlmqQ==}
 
-  /@types/prettier@3.0.0:
-    resolution: {integrity: sha512-mFMBfMOz8QxhYVbuINtswBp9VL2b4Y0QqYHwqLz3YbgtfAcat2Dl6Y1o4e22S/OVE6Ebl9m7wWiMT2lSbAs1wA==}
-    deprecated: This is a stub types definition. prettier provides its own type definitions, so you do not need this installed.
-    dependencies:
-      prettier: 3.0.3
-    dev: true
-
   /@types/prompts@2.4.4:
     resolution: {integrity: sha512-p5N9uoTH76lLvSAaYSZtBCdEXzpOOufsRjnhjVSrZGXikVGHX9+cc9ERtHRV4hvBKHyZb1bg4K+56Bd2TqUn4A==}
     dependencies:
@@ -2482,6 +2481,10 @@ packages:
     resolution: {integrity: sha512-XXOFtyqDjNDAQxVfYxuF7g9Il/IbWmmlQg2MYKOH8ExIT1qg6xc4zyS3HaEEATgs1btfzxq15ciUiY7gjSXRGQ==}
     dev: false
 
+  /immer@10.0.2:
+    resolution: {integrity: sha512-Rx3CqeqQ19sxUtYV9CU911Vhy8/721wRFnJv3REVGWUmoAcIwzifTsdmJte/MV+0/XpM35LZdQMBGkRIoLPwQA==}
+    dev: false
+
   /immutable@4.3.1:
     resolution: {integrity: sha512-lj9cnmB/kVS0QHsJnYKD1uo3o39nrbKxszjnqS9Fr6NB7bZzW45U6WSGBPKXDL/CvDKqDNPA4r3DoDQ8GTxo2A==}
     dev: true
@@ -2592,6 +2595,12 @@ packages:
     hasBin: true
     dev: false
 
+  /is-docker@3.0.0:
+    resolution: {integrity: sha512-eljcgEDlEns/7AXFosB5K/2nCM4P7FQPkGc/DWLy5rmFEWvZayGrik1d9/QIY5nJ4f9YsVvBkA6kJpHn9rISdQ==}
+    engines: {node: ^12.20.0 || ^14.13.1 || >=16.0.0}
+    hasBin: true
+    dev: false
+
   /is-extglob@2.1.1:
     resolution: {integrity: sha512-SbKbANkN603Vi4jEZv49LeVJMn4yGwsbzZworEoyEiutsN3nJYdbO36zfhGJ6QEDpOZIFkDtnq5JRxmvl3jsoQ==}
     engines: {node: '>=0.10.0'}
@@ -2732,6 +2741,13 @@ packages:
       is-docker: 2.2.1
     dev: false
 
+  /is-wsl@3.0.0:
+    resolution: {integrity: sha512-TQ7xXW/fTBaz/HhGSV779AC99ocpvb9qJPuPwyIea+F+Z+htcQ1wouAA0xEQaa4saVqyP8mwkoYp5efeM/4Gbg==}
+    engines: {node: '>=16'}
+    dependencies:
+      is-docker: 3.0.0
+    dev: false
+
   /is-yarn-global@0.4.1:
     resolution: {integrity: sha512-/kppl+R+LO5VmhYSEWARUFjodS25D68gvj8W7z0I7OWhUla5xWu8KL6CtB2V0R6yqhnRgbcaREMr4EEM6htLPQ==}
     engines: {node: '>=12'}

src/client/index.ts

@@ -1,3 +1,4 @@
 export * from './defineContentScript';
 export * from './defineBackground';
 export * from './mountContentScriptUi';
+export * from './utils/ContentScriptContext';

src/client/utils/logger.ts

@@ -1,4 +1,6 @@
 function print(method: (...args: any[]) => void, ...args: any[]) {
+  if (import.meta.env.MODE === 'production') return;
+
   if (typeof args[0] === 'string') {
     const message = args.shift();
     method(`[wxt] ${message}`, ...args);

src/core/build/buildEntrypoints.ts

@@ -89,7 +89,7 @@ async function buildSingleEntrypoint(
   }
   const entryConfig = vite.mergeConfig(
     libMode,
-    config.vite,
+    await config.vite(config.env),
   ) as vite.InlineConfig;
 
   const result = await vite.build(entryConfig);
@@ -132,7 +132,7 @@ async function buildMultipleEntrypoints(
 
   const entryConfig = vite.mergeConfig(
     multiPage,
-    config.vite,
+    await config.vite(config.env),
   ) as vite.UserConfig;
 
   const result = await vite.build(entryConfig);

src/core/runners/index.ts

@@ -0,0 +1,16 @@
+import { InternalConfig } from '../types';
+import { ExtensionRunner } from './extension-runner';
+import { createWslRunner } from './wsl';
+import { createWebExtRunner } from './web-ext';
+import { createSafariRunner } from './safari';
+
+export async function createExtensionRunner(
+  config: InternalConfig,
+): Promise<ExtensionRunner> {
+  if (config.browser === 'safari') return createSafariRunner();
+
+  const { default: isWsl } = await import('is-wsl'); // ESM only, requires dynamic import
+  if (isWsl) return createWslRunner();
+
+  return createWebExtRunner();
+}

src/core/runners/safari.ts

@@ -0,0 +1,21 @@
+import { ExtensionRunner } from './extension-runner';
+import { relative } from 'node:path';
+
+/**
+ * The Safari runner just logs a warning message because `web-ext` doesn't work with Safari.
+ */
+export function createSafariRunner(): ExtensionRunner {
+  return {
+    async openBrowser(config) {
+      config.logger.warn(
+        `Cannot Safari using web-ext. Load "${relative(
+          process.cwd(),
+          config.outDir,
+        )}" as an unpacked extension manually`,
+      );
+    },
+    async closeBrowser() {
+      // noop
+    },
+  };
+}

src/core/runners/web-ext.ts

@@ -1,5 +1,5 @@
 import type { WebExtRunInstance } from 'web-ext-run';
-import { ExtensionRunner } from './ExtensionRunner';
+import { ExtensionRunner } from './extension-runner';
 
 /**
  * Create an `ExtensionRunner` backed by `web-ext`.
@@ -9,10 +9,7 @@ export function createWebExtRunner(): ExtensionRunner {
 
   return {
     async openBrowser(config) {
-      if (config.browser === 'safari') {
-        config.logger.warn('Cannot open safari automatically.');
-        return;
-      }
+      config.logger.info('Opening browser...');
 
       // Use the plugin's logger instead of web-ext's built-in one.
       const webExtLogger = await import('web-ext-run/util/logger');
@@ -57,6 +54,8 @@ export function createWebExtRunner(): ExtensionRunner {
 
       const webExt = await import('web-ext-run');
       runner = await webExt.default.cmd.run(finalConfig, options);
+
+      config.logger.success('Opened!');
     },
 
     async closeBrowser() {

src/core/runners/wsl.ts

@@ -0,0 +1,21 @@
+import { ExtensionRunner } from './extension-runner';
+import { relative } from 'node:path';
+
+/**
+ * The WSL runner just logs a warning message because `web-ext` doesn't work in WSL.
+ */
+export function createWslRunner(): ExtensionRunner {
+  return {
+    async openBrowser(config) {
+      config.logger.warn(
+        `Cannot open browser when using WSL. Load "${relative(
+          process.cwd(),
+          config.outDir,
+        )}" as an unpacked extension manually`,
+      );
+    },
+    async closeBrowser() {
+      // noop
+    },
+  };
+}

src/core/server.ts

@@ -8,8 +8,8 @@ import * as vite from 'vite';
 import { Scripting } from 'webextension-polyfill';
 import { getEntrypointBundlePath } from './utils/entrypoints';
 import { getContentScriptCssFiles } from './utils/manifest';
-import { createWebExtRunner } from './runners/createWebExtRunner';
 import { buildInternal } from './build';
+import { createExtensionRunner } from './runners';
 
 export async function getServerInfo(): Promise<ServerInfo> {
   const { default: getPort, portNumbers } = await import('get-port');
@@ -34,10 +34,10 @@ export async function setupServer(
   serverInfo: ServerInfo,
   config: InternalConfig,
 ): Promise<WxtDevServer> {
-  const runner = createWebExtRunner();
+  const runner = await createExtensionRunner(config);
 
   const viteServer = await vite.createServer(
-    vite.mergeConfig(serverInfo, config.vite),
+    vite.mergeConfig(serverInfo, await config.vite(config.env)),
   );
 
   const start = async () => {
@@ -45,9 +45,7 @@ export async function setupServer(
     config.logger.success(`Started dev server @ ${serverInfo.origin}`);
 
     server.currentOutput = await buildInternal(config);
-    config.logger.info('Opening browser...');
     await runner.openBrowser(config);
-    config.logger.success('Opened!');
   };
 
   const reloadExtension = () => {

src/core/types/external.ts

@@ -84,13 +84,16 @@ export interface InlineConfig {
    */
   logger?: Logger;
   /**
-   * Custom Vite options, see <https://vitejs.dev/config/shared-options.html>.
+   * Return custom Vite options from a function. See
+   * <https://vitejs.dev/config/shared-options.html>.
    *
-   * [`root`](#root), [`configFile`](#configfile), and [`mode`](#mode) should be set in WXT's config.
+   * [`root`](#root), [`configFile`](#configfile), and [`mode`](#mode) should be set in WXT's config
+   * instead of Vite's.
+   *
+   * This is a function because any vite plugins added need to be recreated for each individual
+   * build step, incase they have internal state causing them to fail when reused.
    */
-  vite?:
-    | WxtViteConfig
-    | ((env: ConfigEnv) => WxtViteConfig | Promise<WxtViteConfig>);
+  vite?: (env: ConfigEnv) => WxtViteConfig | Promise<WxtViteConfig>;
   /**
    * Customize the `manifest.json` output. Can be an object, promise, or function that returns an
    * object or promise.
@@ -152,6 +155,23 @@ export interface InlineConfig {
      */
     ignoredSources?: string[];
   };
+
+  /**
+   * Transform the final manifest before it's written to the file system. Edit the `manifest`
+   * parameter directly, do not return a new object. Return values are ignored.
+   *
+   * @example
+   * defineConfig({
+   *   // Add a CSS-only content script.
+   *   transformManifest(manifest) {
+   *     manifest.content_scripts.push({
+   *       matches: ["*://google.com/*"],
+   *       css: ["content-scripts/some-example.css"],
+   *     });
+   *   }
+   * })
+   */
+  transformManifest?: (manifest: Manifest.WebExtensionManifest) => void;
 }
 
 export interface WxtInlineViteConfig

src/core/types/internal.ts

@@ -7,9 +7,11 @@ import {
   TargetManifestVersion,
   UserManifest,
   ExtensionRunnerConfig,
+  ConfigEnv,
 } from './external';
 import { UnimportOptions } from 'unimport';
 import { ResolvedConfig } from 'c12';
+import { Manifest } from 'webextension-polyfill';
 
 export interface InternalConfig {
   root: string;
@@ -25,9 +27,10 @@ export interface InternalConfig {
   command: 'build' | 'serve';
   browser: TargetBrowser;
   manifestVersion: TargetManifestVersion;
+  env: ConfigEnv;
   logger: Logger;
   imports: false | Partial<UnimportOptions>;
-  vite: vite.InlineConfig;
+  vite: (env: ConfigEnv) => Promise<vite.InlineConfig> | vite.InlineConfig;
   manifest: UserManifest;
   fsCache: FsCache;
   server?: WxtDevServer;
@@ -39,6 +42,7 @@ export interface InternalConfig {
     ignoredSources: string[];
     sourcesRoot: string;
   };
+  transformManifest: (manifest: Manifest.WebExtensionManifest) => void;
 }
 
 export type EntrypointGroup = Entrypoint | Entrypoint[];

src/core/utils/getInternalConfig.ts

@@ -83,6 +83,7 @@ export async function getInternalConfig(
     command,
     debug,
     entrypointsDir,
+    env,
     fsCache: createFsCache(wxtDir),
     imports: mergedConfig.imports ?? {},
     logger,
@@ -96,16 +97,17 @@ export async function getInternalConfig(
     runnerConfig,
     srcDir,
     typesDir,
-    vite: {}, // Real value added after this object is initialized.
+    vite: () => ({}), // Real value added after this object is initialized.
     wxtDir,
     zip: resolveInternalZipConfig(root, mergedConfig),
+    transformManifest(manifest) {
+      userConfig.transformManifest?.(manifest);
+      inlineConfig.transformManifest?.(manifest);
+    },
   };
 
-  finalConfig.vite = await resolveInternalViteConfig(
-    env,
-    mergedConfig,
-    finalConfig,
-  );
+  finalConfig.vite = (env) =>
+    resolveInternalViteConfig(env, mergedConfig, finalConfig);
 
   return finalConfig;
 }
@@ -143,9 +145,9 @@ function mergeInlineConfig(
     return vite.mergeConfig(user, inline);
   };
   const viteConfig = async (env: ConfigEnv): Promise<WxtViteConfig> => {
-    const user = await resolveViteConfig(env, userConfig.vite);
-    const inline = await resolveViteConfig(env, inlineConfig.vite);
-    return vite.mergeConfig(user, inline);
+    const user = await userConfig.vite?.(env);
+    const inline = await inlineConfig.vite?.(env);
+    return vite.mergeConfig(user ?? {}, inline ?? {});
   };
   const runner: InlineConfig['runner'] = vite.mergeConfig(
     userConfig.runner ?? {},
@@ -175,13 +177,6 @@ function mergeInlineConfig(
   };
 }
 
-async function resolveViteConfig(
-  env: ConfigEnv,
-  vite: InlineConfig['vite'],
-): Promise<WxtViteConfig> {
-  return await (typeof vite === 'function' ? vite(env) : vite ?? {});
-}
-
 function resolveInternalZipConfig(
   root: string,
   mergedConfig: InlineConfig,
@@ -211,13 +206,13 @@ async function resolveInternalViteConfig(
   mergedConfig: InlineConfig,
   finalConfig: InternalConfig,
 ) {
-  const internalVite: vite.InlineConfig = await resolveViteConfig(
-    env,
-    mergedConfig.vite,
-  );
+  const internalVite: vite.InlineConfig =
+    (await mergedConfig.vite?.(env)) ?? {};
+
   internalVite.root = finalConfig.root;
   internalVite.configFile = false;
   internalVite.logLevel = 'warn';
+  internalVite.mode = env.mode;
 
   internalVite.build ??= {};
   internalVite.build.outDir = finalConfig.outDir;

src/core/utils/manifest.ts

@@ -19,6 +19,7 @@ import {
 import { getPackageJson } from './package';
 import { normalizePath } from './paths';
 import { writeFileIfDifferent } from './fs';
+import { produce } from 'immer';
 
 /**
  * Writes the manifest to the output directory and the build output.
@@ -89,7 +90,7 @@ export async function generateMainfest(
     );
   }
 
-  return manifest;
+  return produce(manifest, config.transformManifest);
 }
 
 /**

src/index.ts

@@ -41,7 +41,7 @@ export async function createServer(
     return getInternalConfig(
       {
         ...config,
-        vite: serverInfo.viteServerConfig,
+        vite: () => serverInfo.viteServerConfig,
       },
       'serve',
     );

src/testing/fake-objects.ts

@@ -198,34 +198,43 @@ export function fakeArray<T>(createItem: () => T, count = 3): T[] {
   return array;
 }
 
-export const fakeInternalConfig = fakeObjectCreator<InternalConfig>(() => ({
-  browser: faker.helpers.arrayElement(['chrome', 'firefox']),
-  command: faker.helpers.arrayElement(['build', 'serve']),
-  entrypointsDir: fakeDir(),
-  fsCache: mock<FsCache>(),
-  imports: {},
-  logger: mock(),
-  manifest: fakeManifest(),
-  manifestVersion: faker.helpers.arrayElement([2, 3]),
-  mode: faker.helpers.arrayElement(['development', 'production']),
-  outBaseDir: fakeDir(),
-  outDir: fakeDir(),
-  publicDir: fakeDir(),
-  root: fakeDir(),
-  runnerConfig: {
-    config: {},
-  },
-  debug: faker.datatype.boolean(),
-  srcDir: fakeDir(),
-  typesDir: fakeDir(),
-  vite: {},
-  wxtDir: fakeDir(),
-  server: mock<WxtDevServer>(),
-  zip: {
-    artifactTemplate: '{{name}}-{{version}}.zip',
-    ignoredSources: [],
-    sourcesRoot: fakeDir(),
-    sourcesTemplate: '{{name}}-sources.zip',
-    name: faker.person.firstName().toLowerCase(),
-  },
-}));
+export const fakeInternalConfig = fakeObjectCreator<InternalConfig>(() => {
+  const browser = faker.helpers.arrayElement(['chrome', 'firefox']);
+  const command = faker.helpers.arrayElement(['build', 'serve'] as const);
+  const manifestVersion = faker.helpers.arrayElement([2, 3] as const);
+  const mode = faker.helpers.arrayElement(['development', 'production']);
+
+  return {
+    browser,
+    command,
+    entrypointsDir: fakeDir(),
+    env: { browser, command, manifestVersion, mode },
+    fsCache: mock<FsCache>(),
+    imports: {},
+    logger: mock(),
+    manifest: fakeManifest(),
+    manifestVersion,
+    mode,
+    outBaseDir: fakeDir(),
+    outDir: fakeDir(),
+    publicDir: fakeDir(),
+    root: fakeDir(),
+    runnerConfig: {
+      config: {},
+    },
+    debug: faker.datatype.boolean(),
+    srcDir: fakeDir(),
+    typesDir: fakeDir(),
+    vite: () => ({}),
+    wxtDir: fakeDir(),
+    server: mock<WxtDevServer>(),
+    zip: {
+      artifactTemplate: '{{name}}-{{version}}.zip',
+      ignoredSources: [],
+      sourcesRoot: fakeDir(),
+      sourcesTemplate: '{{name}}-sources.zip',
+      name: faker.person.firstName().toLowerCase(),
+    },
+    transformManifest: () => {},
+  };
+});

templates/react/wxt.config.ts

@@ -3,7 +3,7 @@ import react from '@vitejs/plugin-react';
 
 // See https://wxt.dev/config.html
 export default defineConfig({
-  vite: {
+  vite: () => ({
     plugins: [react()],
-  },
+  }),
 });

templates/solid/wxt.config.ts

@@ -3,10 +3,10 @@ import Solid from 'vite-plugin-solid';
 
 // See https://wxt.dev/config.html
 export default defineConfig({
-  vite: {
+  vite: () => ({
     build: {
       target: 'esnext',
     },
     plugins: [Solid()],
-  },
+  }),
 });

templates/svelte/wxt.config.ts

@@ -4,7 +4,7 @@ import { svelte, vitePreprocess } from '@sveltejs/vite-plugin-svelte';
 // See https://wxt.dev/config.html
 export default defineConfig({
   srcDir: 'src',
-  vite: {
+  vite: () => ({
     plugins: [
       svelte({
         // Using a svelte.config.js file causes a segmentation fault when importing the file
@@ -12,5 +12,5 @@ export default defineConfig({
         preprocess: [vitePreprocess()],
       }),
     ],
-  },
+  }),
 });

templates/vue/wxt.config.ts

@@ -3,7 +3,7 @@ import vue from '@vitejs/plugin-vue';
 
 // See https://wxt.dev/config.html
 export default defineConfig({
-  vite: {
+  vite: () => ({
     plugins: [vue()],
-  },
+  }),
 });