chore: Rename package to wxt

.gitignore

@@ -1,9 +1,9 @@
 .DS_Store
 .env
 .env.*
-.exvite
 .idea
 .output
+.wxt
 *.log
 /.vscode/
 /docs/.vitepress/cache

README.md

@@ -1,26 +1,23 @@
-# Exvite
+# WXT
 
-> Next generation framework for building web extensions. Powered by [Vite](https://vitejs.dev/)
-
-Name ideas:
-
-cyfer, wavex, webext, aura, iron, reyna, aggron, wxt, yiga
+> Next gen framework for building web extensions. Powered by [Vite](https://vitejs.dev/)
 
 ## Features
 
 - [x] Supports all browsers
 - [x] MV2 & MV3 support
 - [x] Directory based entrypoints
-- [x] Virtual content script and background entryoints for default behaviors
+- [x] Virtual content script and background entryoints with default behaviors
 - [ ] Great DX
   - [x] Auto-imports
   - [x] TypeScript,
   - [x] HMR for HTML pages
-  - [ ] auto-reload for background and content scripts
+  - [ ] Auto-reload for background and content scripts
+- [x] Unit and E2E tests
 - [ ] Open browser during development with extension installed
 - [x] Download and bundle remote dependencies
 - [x] Supports all major frontend frameworks (Vue, React, Svelte)
-- [ ] Project bootstrap
 - [ ] Automated publishing
+- [ ] Project bootstrap
 - [ ] Bundle analysis
 - [ ] ~~_Infer permissions from code_~~ Maybe in the future...

demo/package.json

@@ -1,18 +1,18 @@
 {
   "name": "Demo Extension",
   "version": "1.0.0",
-  "description": "Demo extension for exvite",
+  "description": "Demo extension for WXT",
   "type": "module",
   "scripts": {
-    "dev": "pnpm -w build && exvite",
-    "build": "pnpm -w build && exvite build",
-    "prepare": "pnpm -w build && exvite prepare"
+    "dev": "pnpm -w build && wxt",
+    "build": "pnpm -w build && wxt build",
+    "prepare": "pnpm -w build && wxt prepare"
   },
   "dependencies": {
     "webextension-polyfill": "^0.10.0"
   },
   "devDependencies": {
     "@types/webextension-polyfill": "^0.10.0",
-    "exvite": "workspace:*"
+    "wxt": "workspace:*"
   }
 }

demo/tsconfig.json

@@ -1,3 +1,3 @@
 {
-  "extends": ["../tsconfig.base.json", "./src/.exvite/tsconfig.json"]
+  "extends": ["../tsconfig.base.json", "./src/.wxt/tsconfig.json"]
 }

demo/wxt.config.ts

@@ -1,4 +1,4 @@
-import { defineConfig } from 'exvite';
+import { defineConfig } from 'wxt';
 
 export default defineConfig({
   srcDir: 'src',

e2e/tests/auto-imports.test.ts

@@ -16,11 +16,11 @@ describe('Auto Imports', () => {
 
     await project.build();
 
-    expect(await project.serializeFile('.exvite/types/paths.d.ts'))
+    expect(await project.serializeFile('.wxt/types/paths.d.ts'))
       .toMatchInlineSnapshot(`
-        ".exvite/types/paths.d.ts
+        ".wxt/types/paths.d.ts
         ----------------------------------------
-        // Generated by exvite
+        // Generated by wxt
         type EntrypointPath =
           | \\"/background.js\\"
           | \\"/content-scripts/overlay.js\\"
@@ -35,18 +35,18 @@ describe('Auto Imports', () => {
 
     await project.build();
 
-    expect(await project.serializeFile('.exvite/types/imports.d.ts'))
+    expect(await project.serializeFile('.wxt/types/imports.d.ts'))
       .toMatchInlineSnapshot(`
-      ".exvite/types/imports.d.ts
+      ".wxt/types/imports.d.ts
       ----------------------------------------
-      // Generated by exvite
+      // Generated by wxt
       export {}
       declare global {
         const browser: typeof import('webextension-polyfill')
-        const defineBackgroundScript: typeof import('exvite/client')['defineBackgroundScript']
-        const defineConfig: typeof import('exvite')['defineConfig']
-        const defineContentScript: typeof import('exvite/client')['defineContentScript']
-        const mountContentScriptUi: typeof import('exvite/client')['mountContentScriptUi']
+        const defineBackgroundScript: typeof import('wxt/client')['defineBackgroundScript']
+        const defineConfig: typeof import('wxt')['defineConfig']
+        const defineContentScript: typeof import('wxt/client')['defineContentScript']
+        const mountContentScriptUi: typeof import('wxt/client')['mountContentScriptUi']
       }
       "
     `);

e2e/tests/remote-code.test.ts

@@ -16,7 +16,7 @@ describe('Remote Code', () => {
     );
     expect(output).not.toContain(url);
     expect(
-      await project.fileExists(`.exvite/cache/${encodeURIComponent(url)}`),
+      await project.fileExists(`.wxt/cache/${encodeURIComponent(url)}`),
     ).toBe(true);
   });
 });

e2e/utils.ts

@@ -10,7 +10,7 @@ export class TestProject {
   private readonly root: string;
 
   constructor(root = 'e2e/project') {
-    // We can't put each test's project inside e2e/project directly, otherwise the exvite.config.ts
+    // We can't put each test's project inside e2e/project directly, otherwise the wxt.config.ts
     // file is cached and cannot be different between each test. Instead, we add a random ID to the
     // end to make each test's path unique.
     const id = Math.random().toString(32).substring(3);
@@ -23,7 +23,7 @@ export class TestProject {
           description: 'Example description',
           version: '0.0.0-test',
           dependencies: {
-            exvite: '../../..',
+            wxt: '../../..',
           },
         },
         null,
@@ -33,13 +33,13 @@ export class TestProject {
   }
 
   /**
-   * Add a `exvite.config.ts` to the project with specific contents.
+   * Add a `wxt.config.ts` to the project with specific contents.
    */
   setConfigFileConfig(config: UserConfig = {}) {
     this.config = config;
     this.files.push([
-      'exvite.config.ts',
-      `import { defineConfig } from 'exvite'\n\nexport default defineConfig(${JSON.stringify(
+      'wxt.config.ts',
+      `import { defineConfig } from 'wxt'\n\nexport default defineConfig(${JSON.stringify(
         config,
         null,
         2,
@@ -86,12 +86,12 @@ export class TestProject {
   }
 
   /**
-   * Read all the files from the test project's `.exvite` directory and combine them into a string
+   * Read all the files from the test project's `.wxt` directory and combine them into a string
    * that can be used in a snapshot.
    */
-  serializeExviteDir(): Promise<string> {
+  serializeWxtDir(): Promise<string> {
     return this.serializeDir(
-      resolve(this.config?.srcDir ?? this.root, '.exvite/types'),
+      resolve(this.config?.srcDir ?? this.root, '.wxt/types'),
     );
   }
 

package.json

@@ -1,8 +1,8 @@
 {
-  "name": "exvite",
+  "name": "wxt",
   "type": "module",
   "version": "0.1.0",
-  "description": "Modern JS framework for building web extensions",
+  "description": "Next gen framework for building web extensions",
   "keywords": [
     "vite",
     "chrome",
@@ -34,7 +34,7 @@
     }
   },
   "scripts": {
-    "exvite": "tsx src/cli/index.ts",
+    "wxt": "tsx src/cli/index.ts",
     "build": "run-s -s build:*",
     "build:js": "tsup src/index.ts --sourcemap --dts --format esm,cjs",
     "build:cli": "tsup src/cli/index.ts -d dist/cli --sourcemap",

pnpm-lock.yaml

@@ -61,13 +61,13 @@ importers:
   demo:
     specifiers:
       '@types/webextension-polyfill': ^0.10.0
-      exvite: workspace:*
+      wxt: workspace:*
       webextension-polyfill: ^0.10.0
     dependencies:
       webextension-polyfill: 0.10.0
     devDependencies:
       '@types/webextension-polyfill': 0.10.0
-      exvite: link:..
+      wxt: link:..
 
 packages:
   /@ampproject/remapping/2.2.1:

src/cli/commands/build.ts

@@ -1,12 +1,12 @@
-import * as exvite from '../..';
+import * as wxt from '../..';
 import { getInternalConfig } from '../../utils/getInternalConfig';
 import { defineCommand } from '../utils/defineCommand';
 
 export const build = defineCommand(
   async (root: any, { mode, config: configFile }: any) => {
-    const cliConfig: exvite.InlineConfig = { root, mode, configFile };
+    const cliConfig: wxt.InlineConfig = { root, mode, configFile };
     const config = await getInternalConfig(cliConfig, mode);
 
-    await exvite.build(config);
+    await wxt.build(config);
   },
 );

src/cli/commands/dev.ts

@@ -1,14 +1,14 @@
-import * as exvite from '../..';
+import * as wxt from '../..';
 import { defineCommand } from '../utils/defineCommand';
 
 export const dev = defineCommand(
   async (root: any, { mode, config: configFile }: any) => {
-    const cliConfig: exvite.InlineConfig = {
+    const cliConfig: wxt.InlineConfig = {
       mode,
       root,
       configFile,
     };
-    const server = await exvite.createServer(cliConfig);
+    const server = await wxt.createServer(cliConfig);
 
     await server.listen(server.port);
     server.logger.success(`Started dev server @ ${server.origin}`);

src/cli/commands/init.ts

@@ -2,5 +2,5 @@ import { consola } from 'consola';
 import { defineCommand } from '../utils/defineCommand';
 
 export const init = defineCommand(async (directory: any) => {
-  consola.warn('exvite init: Not implemented');
+  consola.warn('wxt init: Not implemented');
 });

src/cli/commands/prepare.ts

@@ -2,11 +2,11 @@ import { getInternalConfig } from '../../utils/getInternalConfig';
 import { findEntrypoints } from '../../utils/findEntrypoints';
 import { generateTypesDir } from '../../utils/generateTypesDir';
 import { defineCommand } from '../utils/defineCommand';
-import * as exvite from '../..';
+import * as wxt from '../..';
 
 export const prepare = defineCommand(
   async (root: any, { mode, config: configFile }: any) => {
-    const cliConfig: exvite.InlineConfig = { root, mode, configFile };
+    const cliConfig: wxt.InlineConfig = { root, mode, configFile };
     const config = await getInternalConfig(cliConfig, 'build');
 
     config.logger.info('Generating types...');

src/cli/commands/publish.ts

@@ -3,6 +3,6 @@ import { defineCommand } from '../utils/defineCommand';
 
 export const publish = defineCommand(
   async (root: any, { config: configFile }: any) => {
-    consola.warn('exvite publish: Not implemented');
+    consola.warn('wxt publish: Not implemented');
   },
 );

src/cli/index.ts

@@ -4,7 +4,7 @@ import cac from 'cac';
 import { version } from '../../package.json';
 import * as commands from './commands';
 
-const cli = cac('exvite');
+const cli = cac('wxt');
 cli.help();
 cli.version(version);
 

src/cli/utils/printHeader.ts

@@ -3,5 +3,5 @@ import { version } from '../..';
 import { consola } from 'consola';
 
 export function printHeader() {
-  consola.log(`\n${pc.gray('Exvite')} ${pc.gray(pc.bold(version))}`);
+  consola.log(`\n${pc.gray('WXT')} ${pc.gray(pc.bold(version))}`);
 }

src/index.ts

@@ -1,6 +1,6 @@
 import {
   BuildOutput,
-  ExviteDevServer,
+  WxtDevServer,
   InlineConfig,
   InternalConfig,
 } from './types';
@@ -30,7 +30,7 @@ export async function build(config: InlineConfig): Promise<BuildOutput> {
 
 export async function createServer(
   config?: InlineConfig,
-): Promise<ExviteDevServer> {
+): Promise<WxtDevServer> {
   const port = await findOpenPort(3000, 3010);
   const hostname = 'localhost';
   const origin = `http://${hostname}:${port}`;
@@ -53,7 +53,7 @@ export async function createServer(
     if (
       !path.startsWith(internalConfig.srcDir) ||
       path.startsWith(internalConfig.outBaseDir) ||
-      path.startsWith(internalConfig.exviteDir)
+      path.startsWith(internalConfig.wxtDir)
     )
       return;
 
@@ -61,7 +61,7 @@ export async function createServer(
       `${pc.green(eventName + ':')} ${relative(process.cwd(), path)}`,
     );
   });
-  const server: ExviteDevServer = {
+  const server: WxtDevServer = {
     ...viteServer,
     logger: internalConfig.logger,
     port,
@@ -79,7 +79,11 @@ export async function createServer(
 async function buildInternal(config: InternalConfig): Promise<BuildOutput> {
   const verb = config.command === 'serve' ? 'Pre-rendering' : 'Building';
   const target = `${config.browser}-mv${config.manifestVersion}`;
-  config.logger.info(`${verb} ${pc.cyan(target)} for ${pc.cyan(config.mode)}`);
+  config.logger.info(
+    `${verb} ${pc.cyan(target)} for ${pc.cyan(config.mode)} with ${pc.green(
+      `Vite ${vite.version}`,
+    )}`,
+  );
   const startTime = Date.now();
 
   // Cleanup

src/types/external.ts

@@ -20,17 +20,17 @@ export interface InlineConfig {
   logger?: Logger;
   vite?: Omit<vite.InlineConfig, 'root' | 'configFile' | 'mode'>;
   manifest?: UserManifest;
-  server?: ExviteDevServer;
+  server?: WxtDevServer;
 }
 
-export interface ExviteInlineViteConfig
+export interface WxtInlineViteConfig
   extends Omit<vite.InlineConfig, 'root' | 'configFile' | 'mode' | 'build'> {
   build?: Omit<vite.BuildOptions, 'outDir'>;
 }
 
 export type BuildOutput = (vite.Rollup.OutputChunk | vite.Rollup.OutputAsset)[];
 
-export interface ExviteDevServer extends vite.ViteDevServer {
+export interface WxtDevServer extends vite.ViteDevServer {
   logger: Logger;
   port: number;
   hostname: string;
@@ -152,7 +152,7 @@ export interface BackgroundScriptDefintition {
 }
 
 /**
- * Manifest customization available in the `exvite.config.ts` file. Any missing fields like "name"
+ * Manifest customization available in the `wxt.config.ts` file. Any missing fields like "name"
  * and "version" are managed automatically, and don't need to be listed here.
  */
 export type UserManifest = Omit<

src/types/internal.ts

@@ -1,7 +1,7 @@
 import * as vite from 'vite';
 import {
   Entrypoint,
-  ExviteDevServer,
+  WxtDevServer,
   Logger,
   TargetBrowser,
   TargetManifestVersion,
@@ -13,7 +13,7 @@ export interface InternalConfig {
   root: string;
   srcDir: string;
   publicDir: string;
-  exviteDir: string;
+  wxtDir: string;
   typesDir: string;
   entrypointsDir: string;
   outBaseDir: string;
@@ -32,7 +32,7 @@ export interface InternalConfig {
   vite: vite.InlineConfig;
   manifest: UserManifest;
   fsCache: FsCache;
-  server?: ExviteDevServer;
+  server?: WxtDevServer;
 }
 
 export type EntrypointGroup = Entrypoint | Entrypoint[];

src/utils/auto-imports.ts

@@ -9,9 +9,9 @@ export function getUnimportOptions(
     debugLog: config.logger.debug,
     imports: [
       { name: '*', as: 'browser', from: 'webextension-polyfill' },
-      { name: 'defineConfig', from: 'exvite' },
+      { name: 'defineConfig', from: 'wxt' },
     ],
-    presets: [{ package: 'exvite/client' }],
+    presets: [{ package: 'wxt/client' }],
     warn: config.logger.warn,
     dirs: ['components', 'composables', 'hooks', 'utils'],
   };

src/utils/buildEntrypoints.ts

@@ -40,7 +40,7 @@ async function buildSingleEntrypoint(
   // Should this entrypoint be wrapped by the vite-plugins/virtualEntrypoint plugin?
   const isVirtual = ['background', 'content-script'].includes(entrypoint.type);
   const entry = isVirtual
-    ? `virtual:exvite-${entrypoint.type}?${entrypoint.inputPath}`
+    ? `virtual:wxt-${entrypoint.type}?${entrypoint.inputPath}`
     : entrypoint.inputPath;
 
   const libMode: vite.InlineConfig = {
@@ -106,7 +106,7 @@ async function buildMultipleEntrypoints(
 function getBuildOutput(
   result: Awaited<ReturnType<typeof vite.build>>,
 ): BuildOutput {
-  if ('on' in result) throw Error('exvite does not support vite watch mode.');
+  if ('on' in result) throw Error('wxt does not support vite watch mode.');
   if (Array.isArray(result)) return result.flatMap(({ output }) => output);
   return result.output;
 }

src/utils/createFsCache.ts

@@ -3,14 +3,14 @@ import { FsCache } from '../types';
 import { dirname, resolve } from 'path';
 
 /**
- * A basic file system cache stored at `<srcDir>/.exvite/cache/<key>`. Just caches a string in a
+ * A basic file system cache stored at `<srcDir>/.wxt/cache/<key>`. Just caches a string in a
  * file for the given key.
  *
  * @param srcDir Absolute path to source directory. See `InternalConfig.srcDir`
  */
-export function createFsCache(exviteDir: string): FsCache {
+export function createFsCache(wxtDir: string): FsCache {
   const getPath = (key: string) =>
-    resolve(exviteDir, 'cache', encodeURIComponent(key));
+    resolve(wxtDir, 'cache', encodeURIComponent(key));
 
   return {
     async set(key: string, value: string): Promise<void> {

src/utils/generateTypesDir.ts

@@ -35,7 +35,7 @@ async function writeImportsDeclarationFile(
 
   await fs.writeFile(
     filePath,
-    ['// Generated by exvite', await unimport.generateTypeDeclarations()].join(
+    ['// Generated by wxt', await unimport.generateTypeDeclarations()].join(
       '\n',
     ) + '\n',
   );
@@ -52,7 +52,7 @@ async function writePathsDeclarationFile(
   await fs.writeFile(
     filePath,
     [
-      '// Generated by exvite',
+      '// Generated by wxt',
       'type EntrypointPath =',
       ...entrypoints
         .map((entry) => {
@@ -78,7 +78,7 @@ async function writeGlobalsDeclarationFile(
   await fs.writeFile(
     filePath,
     [
-      '// Generated by exvite',
+      '// Generated by wxt',
       'export {}',
       'declare global {',
       ...globals.map((global) => `  const ${global.name}: ${global.type};`),
@@ -93,12 +93,12 @@ async function writeMainDeclarationFile(
   references: string[],
   config: InternalConfig,
 ): Promise<string> {
-  const dir = config.exviteDir;
-  const filePath = resolve(dir, 'exvite.d.ts');
+  const dir = config.wxtDir;
+  const filePath = resolve(dir, 'wxt.d.ts');
   await fs.writeFile(
     filePath,
     [
-      '// Generated by exvite',
+      '// Generated by wxt',
       ...references.map(
         (ref) => `/// <reference types="./${relative(dir, ref)}" />`,
       ),
@@ -111,7 +111,7 @@ async function writeTsConfigFile(
   mainReference: string,
   config: InternalConfig,
 ) {
-  const dir = config.exviteDir;
+  const dir = config.wxtDir;
   await fs.writeFile(
     resolve(dir, 'tsconfig.json'),
     `{

src/utils/getInternalConfig.ts

@@ -48,7 +48,7 @@ export async function getInternalConfig(
   if (config.configFile !== false) {
     userConfig = await importTsFile<UserConfig>(
       root,
-      path.resolve(root, config.configFile ?? 'exvite.config.ts'),
+      path.resolve(root, config.configFile ?? 'wxt.config.ts'),
     );
   }
 
@@ -65,17 +65,17 @@ export async function getInternalConfig(
     userConfig.entrypointsDir ?? 'entrypoints',
   );
   const publicDir = resolve(srcDir, userConfig.publicDir ?? 'public');
-  const exviteDir = resolve(srcDir, '.exvite');
-  const typesDir = resolve(exviteDir, 'types');
+  const wxtDir = resolve(srcDir, '.wxt');
+  const typesDir = resolve(wxtDir, 'types');
 
   const finalConfig: InternalConfig = {
     ...merged,
     srcDir,
     entrypointsDir,
     publicDir,
-    exviteDir,
+    wxtDir: wxtDir,
     typesDir,
-    fsCache: createFsCache(exviteDir),
+    fsCache: createFsCache(wxtDir),
   };
 
   // Customize the default vite config
@@ -112,10 +112,5 @@ export async function getInternalConfig(
  */
 type InternalConfigNoUserDirs = Omit<
   InternalConfig,
-  | 'srcDir'
-  | 'publicDir'
-  | 'entrypointsDir'
-  | 'exviteDir'
-  | 'typesDir'
-  | 'fsCache'
+  'srcDir' | 'publicDir' | 'entrypointsDir' | 'wxtDir' | 'typesDir' | 'fsCache'
 >;

src/utils/importTsFile.ts

@@ -6,7 +6,7 @@ import { scanExports } from 'unimport';
 
 export async function importTsFile<T>(root: string, path: string): Promise<T> {
   const clientImports = await scanExports(
-    resolve(root, 'node_modules/exvite/dist/client/index.js'),
+    resolve(root, 'node_modules/wxt/dist/client/index.js'),
   );
   const jiti = createJITI(__filename, {
     cache: false,
@@ -21,7 +21,7 @@ export async function importTsFile<T>(root: string, path: string): Promise<T> {
         '',
       );
 
-      // Append any exvite/client functions so babel doesn't complain about undefined variables
+      // Append any wxt/client functions so babel doesn't complain about undefined variables
       if (opts.filename === path) {
         // TODO: Only append import if it isn't already imported
         const imports =

src/vite-plugins/devHtmlPrerender.ts

@@ -10,7 +10,7 @@ import { dirname, isAbsolute, relative, resolve } from 'path';
 export function devHtmlPrerender(config: InternalConfig): vite.Plugin {
   return {
     apply: 'build',
-    name: 'exvite:dev-html-prerender',
+    name: 'wxt:dev-html-prerender',
     async transform(html, id) {
       const server = config.server;
       if (config.command !== 'serve' || server == null || !id.endsWith('.html'))

src/vite-plugins/download.ts

@@ -11,7 +11,7 @@ import { fetchCached } from '../utils/network';
  */
 export function download(config: InternalConfig): Plugin {
   return {
-    name: 'exvite:download',
+    name: 'wxt:download',
     resolveId(id) {
       if (id.startsWith('url:')) return '\0' + id;
     },

src/vite-plugins/multipageMove.ts

@@ -20,7 +20,7 @@ export function multipageMove(
   config: InternalConfig,
 ): vite.Plugin {
   return {
-    name: 'exvite:multipage-move',
+    name: 'wxt:multipage-move',
     async writeBundle(_, bundle) {
       for (const oldBundlePath in bundle) {
         // oldBundlePath = 'entrypoints/popup.html' or 'entrypoints/o ptions/index.html'

src/vite-plugins/unimport.ts

@@ -11,7 +11,7 @@ export function unimport(config: InternalConfig): Plugin {
   const unimport = createUnimport(options);
 
   return {
-    name: 'exvite:unimport',
+    name: 'wxt:unimport',
     async config() {
       await unimport.scanImportsFromDir(undefined, { cwd: config.srcDir });
     },

src/vite-plugins/virtualEntrypoint.ts

@@ -10,11 +10,11 @@ export function virtualEntrypoin(
   type: Entrypoint['type'],
   config: InternalConfig,
 ): Plugin {
-  const virtualId = `virtual:exvite-${type}?`;
+  const virtualId = `virtual:wxt-${type}?`;
   const resolvedVirtualId = `\0${virtualId}`;
 
   return {
-    name: `exvite:virtual-entrypoint`,
+    name: `wxt:virtual-entrypoint`,
     resolveId(id) {
       // Id doesn't start with prefix, it looks like this:
       // /path/to/project/virtual:background?/path/to/project/entrypoints/background.ts
@@ -29,10 +29,7 @@ export function virtualEntrypoin(
 
       const inputPath = id.replace(resolvedVirtualId, '');
       const template = await fs.readFile(
-        resolve(
-          config.root,
-          `node_modules/exvite/templates/virtual-${type}.ts`,
-        ),
+        resolve(config.root, `node_modules/wxt/templates/virtual-${type}.ts`),
         'utf-8',
       );
       return template.replaceAll('{{moduleId}}', inputPath);