chore(release): v0.15.0

fix: Enable inline sourcemaps by default during development (#382 )
fix!: Move browser constants to import.meta.env (#380 )
2024-01-29 17:18:38 +00:00 · 2024-01-29 11:15:57 -06:00 · 2024-01-29 11:14:18 -06:00 · 2024-01-29 11:13:39 -06:00 · 2024-01-29 10:59:54 -06:00 · 2024-01-29 10:30:42 -06:00
46 changed files with 1035 additions and 232 deletions
@@ -30,10 +30,10 @@ jobs:
    steps:
      - uses: actions/checkout@v3
      - uses: ./.github/actions/setup
-      - run: pnpm build:all
-        working-directory: demo
      - run: pnpm tsc --noEmit
        working-directory: demo
+      - run: pnpm build:all
+        working-directory: demo
      - run: pnpm wxt zip
        working-directory: demo
      - run: pnpm vitest run
@@ -1,5 +1,87 @@
 # Changelog

+## v0.15.0
+
+[compare changes](https://github.com/wxt-dev/wxt/compare/v0.14.7...v0.15.0)
+
+### 🚀 Enhancements
+
+- **zip:** ⚠️  Add `includeSources` and rename `ignoredSources` to `excludeSources` ([#378](https://github.com/wxt-dev/wxt/pull/378))
+
+### 🩹 Fixes
+
+- Generate missing sourcemap in `wxt:unimport` plugin ([#381](https://github.com/wxt-dev/wxt/pull/381))
+- ⚠️  Move browser constants to `import.meta.env` ([#380](https://github.com/wxt-dev/wxt/pull/380))
+- Enable inline sourcemaps by default during development ([#382](https://github.com/wxt-dev/wxt/pull/382))
+
+### 📖 Documentation
+
+- Fix typo ([f9718a1](https://github.com/wxt-dev/wxt/commit/f9718a1))
+
+### 🏡 Chore
+
+- Update contributor docs ([eb758bd](https://github.com/wxt-dev/wxt/commit/eb758bd))
+
+#### ⚠️ Breaking Changes
+
+- **zip:** ⚠️  Add `includeSources` and rename `ignoredSources` to `excludeSources` ([#378](https://github.com/wxt-dev/wxt/pull/378))
+- ⚠️  Move browser constants to `import.meta.env` ([#380](https://github.com/wxt-dev/wxt/pull/380))
+
+### ❤️ Contributors
+
+- Nenad Novaković
+
+## v0.14.7
+
+[compare changes](https://github.com/wxt-dev/wxt/compare/v0.14.6...v0.14.7)
+
+### 🩹 Fixes
+
+- Improve error messages when importing and building entrypoints ([3b63a51](https://github.com/wxt-dev/wxt/commit/3b63a51))
+- **storage:** Throw better error message when importing outside a extension environment ([35865ad](https://github.com/wxt-dev/wxt/commit/35865ad))
+- Upgrade `web-ext-run` ([62ecb6f](https://github.com/wxt-dev/wxt/commit/62ecb6f))
+
+### 📖 Documentation
+
+- Add `matches` to content script examples ([dab8efa](https://github.com/wxt-dev/wxt/commit/dab8efa))
+- Fix incorrect sample code ([#372](https://github.com/wxt-dev/wxt/pull/372))
+- Document defined constants for the build target ([68874e6](https://github.com/wxt-dev/wxt/commit/68874e6))
+- Add missing `await` to `createShadowRootUi` examples ([fc45c37](https://github.com/wxt-dev/wxt/commit/fc45c37))
+
+### ❤️ Contributors
+
+- 東奈比 ([@dongnaebi](http://github.com/dongnaebi))
+
+## v0.14.6
+
+[compare changes](https://github.com/wxt-dev/wxt/compare/v0.14.5...v0.14.6)
+
+### 🚀 Enhancements
+
+- Restart dev mode when saving config ([#365](https://github.com/wxt-dev/wxt/pull/365))
+- Add basic validation for entrypoint options ([#368](https://github.com/wxt-dev/wxt/pull/368))
+
+### 🩹 Fixes
+
+- Add subdependency bin directory so `wxt build --analyze` works with PNPM ([#363](https://github.com/wxt-dev/wxt/pull/363))
+- Sort build output files naturally ([#364](https://github.com/wxt-dev/wxt/pull/364))
+
+### 🤖 CI
+
+- Check for type errors in demo before building ([4b005b4](https://github.com/wxt-dev/wxt/commit/4b005b4))
+
+## v0.14.5
+
+[compare changes](https://github.com/wxt-dev/wxt/compare/v0.14.4...v0.14.5)
+
+### 🚀 Enhancements
+
+- Add `dev.reloadCommand` config ([#362](https://github.com/wxt-dev/wxt/pull/362))
+
+### 🩹 Fixes
+
+- Disable reload dev command when 4 commands are already registered ([#361](https://github.com/wxt-dev/wxt/pull/361))
+
 ## v0.14.4

 [compare changes](https://github.com/wxt-dev/wxt/compare/v0.14.3...v0.14.4)
@@ -57,9 +57,17 @@ pnpm test
 pnpm docs:dev
 ```

+## Updating Docs
+
+Documentation is written with VitePress, and is located in the `docs/` directory.
+
+The API reference is generated from JSDoc comments in the source code. If there's a typo or change you want to make in there, you'll need to update the source code instead of a file in the `docs/` directory.
+
 ## Testing

-WXT has unit and E2E tests. When making a change or adding a feature, make sure to update the tests or add new ones.
+WXT has unit and E2E tests. When making a change or adding a feature, make sure to update the tests or add new ones, if they exist.
+
+> If they don't exist, feel free to create them, but that's a lot for a one-time contributor. A maintainer might add them to your PR though.

 To run tests for a specific file, add the filename at the end of the test command:

@@ -4,10 +4,10 @@ export default defineBackground(() => {
  console.log(browser.runtime.id);
  logId();
  console.log({
-    browser: __BROWSER__,
-    chrome: __IS_CHROME__,
-    firefox: __IS_FIREFOX__,
-    manifestVersion: __MANIFEST_VERSION__,
+    browser: import.meta.env.BROWSER,
+    chrome: import.meta.env.CHROME,
+    firefox: import.meta.env.FIREFOX,
+    manifestVersion: import.meta.env.MANIFEST_VERSION,
    messages,
  });

@@ -21,6 +21,8 @@ Integrated content script UIs are injected alongside the content of a page. This
 ```ts [Vanilla]
 // entrypoints/example-ui.content.ts
 export default defineContentScript({
+  matches: ['<all_urls>'],
+
  main(ctx) {
    const ui = createIntegratedUi(ctx, {
      position: 'inline',
@@ -45,6 +47,8 @@ import { createApp } from 'vue';
 import App from './App.vue';

 export default defineContentScript({
+  matches: ['<all_urls>'],
+
  main(ctx) {
    const ui = createIntegratedUi(ctx, {
      position: 'inline',
@@ -73,6 +77,8 @@ import ReactDOM from 'react-dom/client';
 import App from './App.tsx';

 export default defineContentScript({
+  matches: ['<all_urls>'],
+
  main(ctx) {
    const ui = createIntegratedUi(ctx, {
      position: 'inline',
@@ -100,6 +106,8 @@ export default defineContentScript({
 import App from './App.svelte';

 export default defineContentScript({
+  matches: ['<all_urls>'],
+
  main(ctx) {
    const ui = createIntegratedUi(ctx, {
      position: 'inline',
@@ -128,6 +136,8 @@ export default defineContentScript({
 import { render } from 'solid-js/web';

 export default defineContentScript({
+  matches: ['<all_urls>'],
+
  main(ctx) {
    const ui = createIntegratedUi(ctx, {
      position: 'inline',
@@ -174,6 +184,7 @@ To use `createShadowRootUi`, follow these steps:
 import './style.css';

 export default defineContentScript({
+  matches: ['<all_urls>'],
  // 2. Set cssInjectionMode
  cssInjectionMode: 'ui',

@@ -182,7 +193,7 @@ export default defineContentScript({
    const ui = await createShadowRootUi(ctx, {
      name: 'example-ui',
      anchor: '#anchor',
-      type: 'inline',
+      position: 'inline',
      onMount(container) {
        // Define how your UI will be mounted inside the container
        const app = document.createElement('p');
@@ -204,6 +215,7 @@ import { createApp } from 'vue';
 import App from './App.vue';

 export default defineContentScript({
+  matches: ['<all_urls>'],
  // 2. Set cssInjectionMode
  cssInjectionMode: 'ui',

@@ -212,7 +224,7 @@ export default defineContentScript({
    const ui = await createShadowRootUi(ctx, {
      name: 'example-ui',
      anchor: '#anchor',
-      type: 'inline',
+      position: 'inline',
      onMount: (container) => {
        // Define how your UI will be mounted inside the container
        const app = createApp(App);
@@ -238,12 +250,13 @@ import ReactDOM from 'react-dom/client';
 import App from './App.tsx';

 export default defineContentScript({
+  matches: ['<all_urls>'],
  // 2. Set cssInjectionMode
  cssInjectionMode: 'ui',

-  main(ctx) {
+  async main(ctx) {
    // 3. Define your UI
-    const ui = createShadowRootUi(ctx, {
+    const ui = await createShadowRootUi(ctx, {
      name: 'example-ui',
      position: 'inline',
      anchor: '#anchor',
@@ -271,12 +284,13 @@ import './style.css';
 import App from './App.svelte';

 export default defineContentScript({
+  matches: ['<all_urls>'],
  // 2. Set cssInjectionMode
  cssInjectionMode: 'ui',

-  main(ctx) {
+  async main(ctx) {
    // 3. Define your UI
-    const ui = createShadowRootUi(ctx, {
+    const ui = await createShadowRootUi(ctx, {
      name: 'example-ui',
      position: 'inline',
      anchor: '#anchor',
@@ -305,12 +319,13 @@ import './style.css';
 import { render } from 'solid-js/web';

 export default defineContentScript({
+  matches: ['<all_urls>'],
  // 2. Set cssInjectionMode
  cssInjectionMode: 'ui',

-  main(ctx) {
+  async main(ctx) {
    // 3. Define your UI
-    const ui = createShadowRootUi(ctx, {
+    const ui = await createShadowRootUi(ctx, {
      name: 'example-ui',
      position: 'inline',
      anchor: '#anchor',
@@ -377,13 +392,14 @@ WXT provides a helper function, [`createIframeUi`](/api/wxt/client/functions/cre

   ```ts
   export default defineContentScript({
-     // ...
+     matches: ['<all_urls>'],
+
     async main(ctx) {
       // Define the UI
       const ui = await createIframeUi(ctx, {
         page: '/example-iframe.html',
         anchor: '#anchor',
-         type: 'inline',
+         position: 'inline',
         onMount: (wrapper, iframe) => {
           // Add styles to the iframe like width
           iframe.width = 123;
@@ -17,11 +17,9 @@ Separate build targets are written to their own output directories:

 To build for a specific browser, pass the `-b --browser` flag from the CLI:

-```
-
+```sh
 wxt --browser firefox
 wxt build --browser firefox
-
 ```

 By default, it will build for `chrome`. When excluding the [manifest version flags](#target-manifest-version), it will default to the commonly accepted manifest version for that browser.
@@ -112,3 +110,24 @@ export default defineContentScript({
 :::warning
 Only `defineBackground` and `defineContentScript` support per-browser options right now.
 :::
+
+## Runtime
+
+To determine the browser or manifest version at runtime, you can use any of the below variables:
+
+- `import.meta.env.BROWSER`: A string, the target browser, usually equal to the `--browser` flag
+- `import.meta.env.MANIFEST_VERSION`: A number, either `2` or `3`, depending on the manifest version targetted
+- `import.meta.env.CHROME`: A boolean equivalent to `import.meta.env.BROWSER === "chrome"`
+- `import.meta.env.FIREFOX`: A boolean equivalent to `import.meta.env.BROWSER === "firefox"`
+- `import.meta.env.EDGE`: A boolean equivalent to `import.meta.env.BROWSER === "edge"`
+- `import.meta.env.SAFARI`: A boolean equivalent to `import.meta.env.BROWSER === "safari"`
+- `import.meta.env.OPERA`: A boolean equivalent to `import.meta.env.BROWSER === "opera"`
+- `import.meta.env.COMMAND`: A string, `"serve"` when running `wxt` for development or `"build"` in all other cases.
+
+:::info
+These variables are constants defined at build time based on the build target. They do not actually detect which browser the code is running in.
+
+For example, if you build for `--browser chrome` and publish it on Edge, `import.meta.env.BROWSER` will be `"chrome"`, not `"edge"`. You have to build a separate ZIP for `--browser edge` before `import.meta.env.BROWSER` will be `"edge"`.
+
+If you need to know the actual browser your code is being ran on, you should use a [user agent parser](https://www.npmjs.com/package/ua-parser-js).
+:::
@@ -19,7 +19,7 @@ If you want to try to use a different framework for unit tests, you will need to
 - **Auto-imports**: Add `unimport` to your test environment or disable them by setting `imports: false` in your `wxt.config.ts` file
 - **`browser` mock**: Mock the `webextension-polyfill` module globally with `wxt/dist/virtual/mock-browser.js`
 - **[Remote Code Bundling](/guide/remote-code)**: If you use it, configure your environment to handle the `url:` module prefix
- **Global Variables**: If you consume them, manually define globals provided by WXT (like `__BROWSER__`) by adding them to the global scope before accessing them (`globalThis.__BROWSER__ = "chrome"`)
+- **Global Variables**: If you consume them, manually define globals provided by WXT (like `import.meta.env.BROWSER`) by adding them to the global scope before accessing them (`import.meta.env.BROWSER = "chrome"`)
 - **Import paths**: If you use the `@/` or `~/` path aliases, add them to your test environment

 [Here's how Vitest is configured](https://github.com/wxt-dev/wxt/blob/main/src/testing/wxt-vitest-plugin.ts) for reference.
@@ -14,16 +14,19 @@ describe('TypeScript Project', () => {
      ----------------------------------------
      // Generated by wxt
      export {}
-      declare global {
-        const __MANIFEST_VERSION__: 2 | 3;
-        const __BROWSER__: string;
-        const __IS_CHROME__: boolean;
-        const __IS_FIREFOX__: boolean;
-        const __IS_SAFARI__: boolean;
-        const __IS_EDGE__: boolean;
-        const __IS_OPERA__: boolean;
-        const __COMMAND__: "build" | "serve";
-        const __ENTRYPOINT__: string;
+      interface ImportMetaEnv {
+        readonly MANIFEST_VERSION: 2 | 3;
+        readonly BROWSER: string;
+        readonly CHROME: boolean;
+        readonly FIREFOX: boolean;
+        readonly SAFARI: boolean;
+        readonly EDGE: boolean;
+        readonly OPERA: boolean;
+        readonly COMMAND: "build" | "serve";
+        readonly ENTRYPOINT: string;
+      }
+      interface ImportMeta {
+        readonly env: ImportMetaEnv
      }
      "
    `);
@@ -133,7 +136,7 @@ describe('TypeScript Project', () => {
            options?: GetMessageOptions,
          ): string;
          /**
-           * 
+           * No message description.
           *
           * "<browser.i18n.getUiLocale()>"
           */
@@ -1,7 +1,7 @@
 {
  "name": "wxt",
  "type": "module",
-  "version": "0.14.4",
+  "version": "0.15.0",
  "description": "Next gen framework for developing web extensions",
  "engines": {
    "node": ">=18",
@@ -125,7 +125,9 @@
    "jiti": "^1.21.0",
    "json5": "^2.2.3",
    "linkedom": "^0.16.1",
+    "manage-path": "^2.0.0",
    "minimatch": "^9.0.3",
+    "natural-compare": "^1.4.0",
    "normalize-path": "^3.0.0",
    "ora": "^7.0.1",
    "picocolors": "^1.0.0",
@@ -133,7 +135,7 @@
    "rollup-plugin-visualizer": "^5.9.2",
    "unimport": "^3.4.0",
    "vite": "^5.0.0",
-    "web-ext-run": "^0.1.0",
+    "web-ext-run": "^0.1.2",
    "webextension-polyfill": "^0.10.0",
    "zip-dir": "^2.0.0"
  },
@@ -141,6 +143,7 @@
    "@faker-js/faker": "^8.3.1",
    "@types/fs-extra": "^11.0.4",
    "@types/lodash.merge": "^4.6.9",
+    "@types/natural-compare": "^1.4.3",
    "@types/node": "^20.10.3",
    "@types/normalize-path": "^3.0.2",
    "@types/prompts": "^2.4.9",
@@ -74,9 +74,15 @@ importers:
      linkedom:
        specifier: ^0.16.1
        version: 0.16.1
+      manage-path:
+        specifier: ^2.0.0
+        version: 2.0.0
      minimatch:
        specifier: ^9.0.3
        version: 9.0.3
+      natural-compare:
+        specifier: ^1.4.0
+        version: 1.4.0
      normalize-path:
        specifier: ^3.0.0
        version: 3.0.0
@@ -99,8 +105,8 @@ importers:
        specifier: ^5.0.0
        version: 5.0.5(@types/node@20.10.3)(sass@1.69.5)
      web-ext-run:
-        specifier: ^0.1.0
-        version: 0.1.0
+        specifier: ^0.1.2
+        version: 0.1.2
      webextension-polyfill:
        specifier: ^0.10.0
        version: 0.10.0
@@ -117,6 +123,9 @@ importers:
      '@types/lodash.merge':
        specifier: ^4.6.9
        version: 4.6.9
+      '@types/natural-compare':
+        specifier: ^1.4.3
+        version: 1.4.3
      '@types/node':
        specifier: ^20.10.3
        version: 20.10.3
@@ -403,8 +412,8 @@ packages:
      '@babel/types': 7.23.5
    dev: true

-  /@babel/runtime@7.22.11:
-    resolution: {integrity: sha512-ee7jVNlWN09+KftVOu9n7S8gQzD/Z6hN/I8VBRXW4P1+Xe7kJGXMwu8vds4aGIMHZnNbdpSWCfZZtinytpcAvA==}
+  /@babel/runtime@7.23.9:
+    resolution: {integrity: sha512-0CX6F+BI2s9dkUqr08KFrAIZgNFj75rdBU/DjCyYLIaV/quFjkk6T+EJ2LkZHyZTbEV4L5p97mNkUsHl2wLFAw==}
    engines: {node: '>=6.9.0'}
    dependencies:
      regenerator-runtime: 0.14.0
@@ -433,8 +442,8 @@ packages:
    engines: {node: '>= 0.10.4'}
    dev: false

-  /@devicefarmer/adbkit@3.2.5:
-    resolution: {integrity: sha512-+J479WWZW3GU3t40flicDfiDrFz6vpiy2RcBQPEhFcs/3La9pOtr4Bgz2Q02E4luUG2RAL068rqIkKNUTy3tZw==}
+  /@devicefarmer/adbkit@3.2.6:
+    resolution: {integrity: sha512-8lO1hSeTgtxcOHhp4tTWq/JaOysp5KNbbyFoxNEBnwkCDZu/Bji3ZfOaG++Riv9jN6c9bgdLBOZqJTC5VJPRKQ==}
    engines: {node: '>= 0.10.4'}
    hasBin: true
    dependencies:
@@ -1106,6 +1115,10 @@ packages:
    resolution: {integrity: sha512-Klz949h02Gz2uZCMGwDUSDS1YBlTdDDgbWHi+81l29tQALUtvz4rAYi5uoVhE5Lagoq6DeqAUlbrHvW/mXDgdQ==}
    dev: false

+  /@types/natural-compare@1.4.3:
+    resolution: {integrity: sha512-XCAxy+Gg6+S6VagwzcknnvCKujj/bVv1q+GFuCrFEelqaZPqJoC+FeXLwc2dp+oLP7qDZQ4ZfQiTJQ9sIUmlLw==}
+    dev: true
+
  /@types/node@20.10.3:
    resolution: {integrity: sha512-XJavIpZqiXID5Yxnxv3RUDKTN5b81ddNC3ecsA0SoFXz/QU8OGBwZGMomiq0zw+uuqbL/krztv/DINAQ/EV4gg==}
    dependencies:
@@ -2367,8 +2380,8 @@ packages:
    dependencies:
      to-regex-range: 5.0.1

-  /firefox-profile@4.3.2:
-    resolution: {integrity: sha512-/C+Eqa0YgIsQT2p66p7Ygzqe7NlE/GNTbhw2SBCm5V3OsWDPITNdTPEcH2Q2fe7eMpYYNPKdUcuVioZBZiR6kA==}
+  /firefox-profile@4.5.0:
+    resolution: {integrity: sha512-goE2XxbmYVSafvCjcy64/AK3xOr14HCUCD4+TpYWEIMy4nrJfNAacLGzwqKwZhCW0hHI2TYMGH+G/YBvOE8L6g==}
    hasBin: true
    dependencies:
      adm-zip: 0.5.10
@@ -2409,6 +2422,15 @@ packages:
      universalify: 2.0.0
    dev: false

+  /fs-extra@11.2.0:
+    resolution: {integrity: sha512-PmDi3uwK5nFuXh7XDTlVnS17xJS7vW36is2+w3xcv8SVxiB4NyATf4ctkVY5bkSjX0Y4nbvZCq1/EjtEyr9ktw==}
+    engines: {node: '>=14.14'}
+    dependencies:
+      graceful-fs: 4.2.11
+      jsonfile: 6.1.0
+      universalify: 2.0.0
+    dev: false
+
  /fs-extra@9.0.1:
    resolution: {integrity: sha512-h2iAoN838FqAFJY2/qVpzFXy+EBxfVE220PalAqQLDVsFOHLJrZvut5puAbCdNv6WJk+B8ihI+k0c7JK5erwqQ==}
    engines: {node: '>=10'}
@@ -2454,8 +2476,8 @@ packages:
    resolution: {integrity: sha512-xckBUXyTIqT97tq2x2AMb+g163b5JFysYk0x4qxNFwbfQkmNZoiRHb6sPzI9/QV33WeuvVYBUIiD4NzNIyqaRQ==}
    dev: true

-  /fx-runner@1.3.0:
-    resolution: {integrity: sha512-5b37H4GCyhF+Nf8xk9mylXoDq4wb7pbGAXxlCXp/631UTeeZomWSYcEGXumY4wk8g2QAqjPMGdWW+RbNt8PUcA==}
+  /fx-runner@1.4.0:
+    resolution: {integrity: sha512-rci1g6U0rdTg6bAaBboP7XdRu01dzTAaKXxFf+PUqGuCv6Xu7o8NZdY1D5MvKGIjb6EdS1g3VlXOgksir1uGkg==}
    hasBin: true
    dependencies:
      commander: 2.9.0
@@ -3352,6 +3374,10 @@ packages:
    resolution: {integrity: sha512-s8UhlNe7vPKomQhC1qFelMokr/Sc3AgNbso3n74mVPA5LTZwkB9NlXf4XPamLxJE8h0gh73rM94xvwRT2CVInw==}
    dev: false

+  /manage-path@2.0.0:
+    resolution: {integrity: sha512-NJhyB+PJYTpxhxZJ3lecIGgh4kwIY2RAh44XvAz9UlqthlQwtPBf62uBVR8XaD8CRuSjQ6TnZH2lNJkbLPZM2A==}
+    dev: false
+
  /mark.js@8.11.1:
    resolution: {integrity: sha512-1I+1qpDt4idfgLQG+BNWmrqku+7/2bi5nLf4YwF8y8zXvmfiTBY3PV3ZibfrjBueCByROpuBjLLFCajqkgYoLQ==}
    dev: true
@@ -3533,6 +3559,10 @@ packages:
    engines: {node: ^10 || ^12 || ^13.7 || ^14 || >=15.0.1}
    hasBin: true

+  /natural-compare@1.4.0:
+    resolution: {integrity: sha512-OWND8ei3VtNC9h7V60qff3SVobHr996CTwgxubgyQYEpg290h9J0buyECNNJexkFm5sOajh5G116RYA1c8ZMSw==}
+    dev: false
+
  /ncp@2.0.0:
    resolution: {integrity: sha512-zIdGUrPRFTUELUvr3Gmc7KZ2Sw/h1PiVM0Af/oHB6zgnV1ikqSfRk+TOufi79aHYCW3NiOXmr1BP5nWbzojLaA==}
    hasBin: true
@@ -3751,8 +3781,8 @@ packages:
      json-parse-better-errors: 1.0.2
    dev: true

-  /parse-json@7.1.0:
-    resolution: {integrity: sha512-ihtdrgbqdONYD156Ap6qTcaGcGdkdAxodO1wLqQ/j7HP1u2sFYppINiq4jyC8F+Nm+4fVufylCV00QmkTHkSUg==}
+  /parse-json@7.1.1:
+    resolution: {integrity: sha512-SgOTCX/EZXtZxBE5eJ97P4yGM5n37BwRU+YMsH4vNzFqJV/oWFXXCmwFlgWUM4PrakybVOueJJ6pwHqSVhTFDw==}
    engines: {node: '>=16'}
    dependencies:
      '@babel/code-frame': 7.22.5
@@ -5165,24 +5195,24 @@ packages:
      graceful-fs: 4.2.11
    dev: false

-  /web-ext-run@0.1.0:
-    resolution: {integrity: sha512-42ezvTBirf1v2hw0q4FqYvAzh39bCn3cMQojTLlaE5Y8DWebVkRGdd0jdSJRzPkB5jZa0CHfnqe8gx6oUllqyw==}
-    engines: {node: '>=16.0.0', npm: '>=8.0.0'}
+  /web-ext-run@0.1.2:
+    resolution: {integrity: sha512-VygO7lg10keonbku5Lbi21zEz1k91odkW+c6YB5DGb+mITcRMVM2zr/tJ+Suh6wxNUOOFNbinoqDlSUWdxt6YQ==}
+    engines: {node: '>=18.0.0', npm: '>=8.0.0'}
    dependencies:
-      '@babel/runtime': 7.22.11
-      '@devicefarmer/adbkit': 3.2.5
+      '@babel/runtime': 7.23.9
+      '@devicefarmer/adbkit': 3.2.6
      bunyan: 1.8.15
      chrome-launcher: 0.15.1
      debounce: 1.2.1
      es6-error: 4.1.1
-      firefox-profile: 4.3.2
-      fs-extra: 11.1.1
-      fx-runner: 1.3.0
+      firefox-profile: 4.5.0
+      fs-extra: 11.2.0
+      fx-runner: 1.4.0
      mkdirp: 1.0.4
      multimatch: 6.0.0
      mz: 2.7.0
      node-notifier: 10.0.1
-      parse-json: 7.1.0
+      parse-json: 7.1.1
      promise-toolbox: 0.21.0
      source-map-support: 0.5.21
      strip-bom: 5.0.0
@@ -5190,7 +5220,7 @@ packages:
      tmp: 0.2.1
      update-notifier: 6.0.2
      watchpack: 2.4.0
-      ws: 8.13.0
+      ws: 8.16.0
      zip-dir: 2.0.0
    transitivePeerDependencies:
      - bufferutil
@@ -5343,8 +5373,8 @@ packages:
      typedarray-to-buffer: 3.1.5
    dev: false

-  /ws@8.13.0:
-    resolution: {integrity: sha512-x9vcZYTrFPC7aSIbj7sRCYo7L/Xb8Iy+pW0ng0wt2vCJv7M9HOMy0UoN3rr+IFC7hb7vXoqS+P9ktyLLLhO+LA==}
+  /ws@8.16.0:
+    resolution: {integrity: sha512-HS0c//TP7Ina87TfiPUz1rQzMhHrl/SG2guqRcTOIUYD2q8uhUdNHZYJUaQ8aTGPzCh+c6oawMKW35nFl1dxyQ==}
    engines: {node: '>=10.0.0'}
    peerDependencies:
      bufferutil: ^4.0.1
@@ -4,6 +4,7 @@ import { build, clean, createServer, initialize, prepare, zip } from '~/core';
 import consola, { LogLevels } from 'consola';
 import { printHeader } from '~/core/utils/log';
 import { formatDuration } from '~/core/utils/time';
+import { ValidationError } from './core/utils/validation';

 // TODO: Remove. See https://github.com/wxt-dev/wxt/issues/277
 process.env.VITE_CJS_IGNORE_WARNING = 'true';
@@ -174,7 +175,11 @@ function wrapAction(
      consola.fail(
        `Command failed after ${formatDuration(Date.now() - startTime)}`,
      );
-      consola.error(err);
+      if (err instanceof ValidationError) {
+        // Don't log these errors, they've already been logged
+      } else {
+        consola.error(err);
+      }
      process.exit(1);
    }
  };
@@ -15,10 +15,12 @@ export class WxtLocationChangeEvent extends Event {
 * Returns an event name unique to the extension and content script that's running.
 */
 export function getUniqueEventName(eventName: string): string {
-  // During the build process, __ENTRYPOINT__ is not defined when importing entrypoints to get their
-  // metadata.
+  // During the build process, import.meta.env is not defined when importing
+  // entrypoints to get their metadata.
  const entrypointName =
-    typeof __ENTRYPOINT__ === 'undefined' ? 'build' : __ENTRYPOINT__;
+    typeof import.meta.env === 'undefined'
+      ? 'build'
+      : import.meta.env.ENTRYPOINT;

  return `${browser.runtime.id}:${entrypointName}:${eventName}`;
 }
@@ -236,7 +236,9 @@ function mountUi(
 * Load the CSS for the current entrypoint.
 */
 async function loadCss(): Promise<string> {
-  const url = browser.runtime.getURL(`/content-scripts/${__ENTRYPOINT__}.css`);
+  const url = browser.runtime.getURL(
+    `/content-scripts/${import.meta.env.ENTRYPOINT}.css`,
+  );
  try {
    const res = await fetch(url);
    return await res.text();
@@ -44,6 +44,10 @@ export async function createViteBuilder(
    if (config.build.minify == null && wxtConfig.command === 'serve') {
      config.build.minify = false;
    }
+    // Enable inline sourcemaps for the dev command (so content scripts have sourcemaps)
+    if (config.build.sourcemap == null && wxtConfig.command === 'serve') {
+      config.build.sourcemap = 'inline';
+    }

    config.plugins ??= [];
    config.plugins.push(
@@ -230,6 +234,9 @@ export async function createViteBuilder(
        async listen() {
          await viteServer.listen(info.port);
        },
+        async close() {
+          await viteServer.close();
+        },
        transformHtml(...args) {
          return viteServer.transformIndexHtml(...args);
        },
@@ -14,7 +14,7 @@ export function entrypointGroupGlobals(
      const define: vite.InlineConfig['define'] = {};
      let name = Array.isArray(entrypointGroup) ? 'html' : entrypointGroup.name;
      for (const global of getEntrypointGlobals(name)) {
-        define[global.name] = JSON.stringify(global.value);
+        define[`import.meta.env.${global.name}`] = JSON.stringify(global.value);
      }
      return {
        define,
@@ -10,7 +10,7 @@ export function globals(
    config() {
      const define: vite.InlineConfig['define'] = {};
      for (const global of getGlobals(config)) {
-        define[global.name] = JSON.stringify(global.value);
+        define[`import.meta.env.${global.name}`] = JSON.stringify(global.value);
      }
      return {
        define,
@@ -36,7 +36,11 @@ export function unimport(
      // Don't transform non-js files
      if (!ENABLED_EXTENSIONS.has(extname(id))) return;

-      return unimport.injectImports(code, id);
+      const injected = await unimport.injectImports(code, id);
+      return {
+        code: injected.code,
+        map: injected.s.generateMap({ hires: 'boundary', source: id }),
+      };
    },
  };
 }
@@ -49,22 +49,46 @@ export async function createServer(
    origin,
  };

+  const buildAndOpenBrowser = async () => {
+    // Build after starting the dev server so it can be used to transform HTML files
+    server.currentOutput = await internalBuild(config);
+
+    // Open browser after everything is ready to go.
+    await runner.openBrowser(config);
+  };
+
+  /**
+   * Stops the previous runner, grabs the latest config, and recreates the runner.
+   */
+  const closeAndRecreateRunner = async () => {
+    await runner.closeBrowser();
+    config = await getLatestConfig();
+    runner = await createExtensionRunner(config);
+  };
+
  // Server instance must be created first so its reference can be added to the internal config used
  // to pre-render entrypoints
  const server: WxtDevServer = {
    ...serverInfo,
-    watcher: undefined as any, // Filled out later down below
-    ws: undefined as any, // Filled out later down below
-    currentOutput: undefined as any, // Filled out later down below
+    get watcher() {
+      return builderServer.watcher;
+    },
+    get ws() {
+      return builderServer.ws;
+    },
+    currentOutput: undefined,
    async start() {
      await builderServer.listen();
      config.logger.success(`Started dev server @ ${serverInfo.origin}`);
-
-      // Build after starting the dev server so it can be used to transform HTML files
-      server.currentOutput = await internalBuild(config);
-
-      // Open browser after everything is ready to go.
-      await runner.openBrowser(config);
+      await buildAndOpenBrowser();
+    },
+    async stop() {
+      await runner.closeBrowser();
+      await builderServer.close();
+    },
+    async restart() {
+      await closeAndRecreateRunner();
+      await buildAndOpenBrowser();
    },
    transformHtml(url, html, originalUrl) {
      return builderServer.transformHtml(url, html, originalUrl);
@@ -78,23 +102,25 @@ export async function createServer(
    reloadExtension() {
      server.ws.send('wxt:reload-extension');
    },
+    async restartBrowser() {
+      await closeAndRecreateRunner();
+      await runner.openBrowser(config);
+    },
  };

  const getLatestConfig = () =>
    getInternalConfig(inlineConfig ?? {}, 'serve', server);
  let config = await getLatestConfig();

-  const [runner, builderServer] = await Promise.all([
+  let [runner, builderServer] = await Promise.all([
    createExtensionRunner(config),
    config.builder.createServer(server),
  ]);

-  server.watcher = builderServer.watcher;
-  server.ws = builderServer.ws;
-
  // Register content scripts for the first time after the background starts up since they're not
  // listed in the manifest
  server.ws.on('wxt:background-initialized', () => {
+    if (server.currentOutput == null) return;
    reloadContentScripts(server.currentOutput.steps, config, server);
  });

@@ -138,18 +164,39 @@ function createFileReloader(options: {
    changeQueue.push([event, path]);

    await fileChangedMutex.runExclusive(async () => {
-      const fileChanges = changeQueue.splice(0, changeQueue.length);
+      if (server.currentOutput == null) return;
+
+      const fileChanges = changeQueue
+        .splice(0, changeQueue.length)
+        .map(([_, file]) => file);
      if (fileChanges.length === 0) return;

-      const changes = detectDevChanges(fileChanges, server.currentOutput);
+      const changes = detectDevChanges(
+        config,
+        fileChanges,
+        server.currentOutput,
+      );
      if (changes.type === 'no-change') return;

+      if (changes.type === 'full-restart') {
+        config.logger.info('Config changed, restarting server...');
+        server.restart();
+        return;
+      }
+
+      if (changes.type === 'browser-restart') {
+        config.logger.info('Runner config changed, restarting browser...');
+        server.restartBrowser();
+        return;
+      }
+
      // Log the entrypoints that were effected
      config.logger.info(
-        `Changed: ${Array.from(new Set(fileChanges.map((change) => change[1])))
+        `Changed: ${Array.from(new Set(fileChanges))
          .map((file) => pc.dim(relative(config.root, file)))
          .join(', ')}`,
      );
+
      const rebuiltNames = changes.rebuildGroups
        .flat()
        .map((entry) => {
@@ -197,6 +244,8 @@ function reloadContentScripts(
 ) {
  if (config.manifestVersion === 3) {
    steps.forEach((step) => {
+      if (server.currentOutput == null) return;
+
      const entry = step.entrypoints;
      if (Array.isArray(entry) || entry.type !== 'content-script') return;

@@ -1,5 +1,6 @@
 import type { WebExtRunInstance } from 'web-ext-run';
 import { ExtensionRunner } from '~/types';
+import { formatDuration } from '../utils/time';

 /**
 * Create an `ExtensionRunner` backed by `web-ext`.
@@ -9,7 +10,7 @@ export function createWebExtRunner(): ExtensionRunner {

  return {
    async openBrowser(config) {
-      config.logger.info('Opening browser...');
+      const startTime = Date.now();

      if (config.browser === 'firefox' && config.manifestVersion === 3) {
        throw Error(
@@ -17,7 +18,7 @@ export function createWebExtRunner(): ExtensionRunner {
        );
      }

-      // Use the plugin's logger instead of web-ext's built-in one.
+      // Use WXT's logger instead of web-ext's built-in one.
      const webExtLogger = await import('web-ext-run/util/logger');
      webExtLogger.consoleStream.write = ({ level, msg, name }) => {
        if (level >= ERROR_LOG_LEVEL) config.logger.error(name, msg);
@@ -61,7 +62,8 @@ export function createWebExtRunner(): ExtensionRunner {
      const webExt = await import('web-ext-run');
      runner = await webExt.default.cmd.run(finalConfig, options);

-      config.logger.success('Opened!');
+      const duration = Date.now() - startTime;
+      config.logger.success(`Opened browser in ${formatDuration(duration)}`);
    },

    async closeBrowser() {
@@ -1,5 +1,5 @@
 import { describe, it, expect } from 'vitest';
-import { every } from '~/core/utils/arrays';
+import { every, some } from '~/core/utils/arrays';

 describe('Array Utils', () => {
  describe('every', () => {
@@ -15,4 +15,20 @@ describe('Array Utils', () => {
      expect(every([1, 2, 1], (item) => item === 1)).toBe(false);
    });
  });
+
+  describe('some', () => {
+    it('should return true if one value returns true', () => {
+      const array = [1, 2, 3];
+      const predicate = (item: number) => item === 2;
+
+      expect(some(array, predicate)).toBe(true);
+    });
+
+    it('should return false if no values match', () => {
+      const array = [1, 2, 3];
+      const predicate = (item: number) => item === 4;
+
+      expect(some(array, predicate)).toBe(false);
+    });
+  });
 });
@@ -6,6 +6,7 @@ import {
  fakeBuildOutput,
  fakeEntrypoint,
  fakeInternalConfig,
+  fakeManifestCommand,
  fakeOptionsEntrypoint,
  fakePopupEntrypoint,
 } from '../testing/fake-objects';
@@ -52,7 +53,11 @@ describe('Manifest Utils', () => {
          },
        };

-        const actual = await generateManifest([popup], buildOutput, config);
+        const { manifest: actual } = await generateManifest(
+          [popup],
+          buildOutput,
+          config,
+        );

        expect(actual).toMatchObject(expected);
      });
@@ -79,7 +84,11 @@ describe('Manifest Utils', () => {
            default_popup: 'popup.html',
          };

-          const actual = await generateManifest([popup], buildOutput, config);
+          const { manifest: actual } = await generateManifest(
+            [popup],
+            buildOutput,
+            config,
+          );

          expect(actual[expectedType]).toEqual(expected);
        },
@@ -102,7 +111,11 @@ describe('Manifest Utils', () => {
          action: config.manifest.action,
        };

-        const actual = await generateManifest([], buildOutput, config);
+        const { manifest: actual } = await generateManifest(
+          [],
+          buildOutput,
+          config,
+        );

        expect(actual).toMatchObject(expected);
      });
@@ -131,7 +144,11 @@ describe('Manifest Utils', () => {
          page: 'options.html',
        };

-        const actual = await generateManifest([options], buildOutput, config);
+        const { manifest: actual } = await generateManifest(
+          [options],
+          buildOutput,
+          config,
+        );

        expect(actual.options_ui).toEqual(expected);
      });
@@ -149,7 +166,11 @@ describe('Manifest Utils', () => {
          page: 'options.html',
        };

-        const actual = await generateManifest([options], buildOutput, config);
+        const { manifest: actual } = await generateManifest(
+          [options],
+          buildOutput,
+          config,
+        );

        expect(actual.options_ui).toEqual(expected);
      });
@@ -179,7 +200,7 @@ describe('Manifest Utils', () => {
              service_worker: 'background.js',
            };

-            const actual = await generateManifest(
+            const { manifest: actual } = await generateManifest(
              [background],
              buildOutput,
              config,
@@ -201,7 +222,7 @@ describe('Manifest Utils', () => {
            scripts: ['background.js'],
          };

-          const actual = await generateManifest(
+          const { manifest: actual } = await generateManifest(
            [background],
            buildOutput,
            config,
@@ -226,7 +247,7 @@ describe('Manifest Utils', () => {
              scripts: ['background.js'],
            };

-            const actual = await generateManifest(
+            const { manifest: actual } = await generateManifest(
              [background],
              buildOutput,
              config,
@@ -248,7 +269,7 @@ describe('Manifest Utils', () => {
            scripts: ['background.js'],
          };

-          const actual = await generateManifest(
+          const { manifest: actual } = await generateManifest(
            [background],
            buildOutput,
            config,
@@ -274,7 +295,11 @@ describe('Manifest Utils', () => {
        });
        const config = fakeInternalConfig();

-        const actual = await generateManifest(entrypoints, buildOutput, config);
+        const { manifest: actual } = await generateManifest(
+          entrypoints,
+          buildOutput,
+          config,
+        );

        expect(actual.icons).toEqual({
          16: 'icon-16.png',
@@ -296,7 +321,11 @@ describe('Manifest Utils', () => {
        });
        const config = fakeInternalConfig();

-        const actual = await generateManifest(entrypoints, buildOutput, config);
+        const { manifest: actual } = await generateManifest(
+          entrypoints,
+          buildOutput,
+          config,
+        );

        expect(actual.icons).toBeUndefined();
      });
@@ -323,7 +352,11 @@ describe('Manifest Utils', () => {
          },
        });

-        const actual = await generateManifest(entrypoints, buildOutput, config);
+        const { manifest: actual } = await generateManifest(
+          entrypoints,
+          buildOutput,
+          config,
+        );

        expect(actual.icons).toEqual(expected);
      });
@@ -423,7 +456,11 @@ describe('Manifest Utils', () => {
          ],
        };

-        const actual = await generateManifest(entrypoints, buildOutput, config);
+        const { manifest: actual } = await generateManifest(
+          entrypoints,
+          buildOutput,
+          config,
+        );

        expect(actual.content_scripts).toContainEqual({
          matches: ['*://google.com/*'],
@@ -480,7 +517,11 @@ describe('Manifest Utils', () => {
          },
        });

-        const actual = await generateManifest(entrypoints, buildOutput, config);
+        const { manifest: actual } = await generateManifest(
+          entrypoints,
+          buildOutput,
+          config,
+        );

        expect(actual.content_scripts).toContainEqual(userContentScript);
        expect(actual.content_scripts).toContainEqual(generatedContentScript);
@@ -516,7 +557,7 @@ describe('Manifest Utils', () => {
              command: 'build',
            });

-            const actual = await generateManifest(
+            const { manifest: actual } = await generateManifest(
              entrypoints,
              buildOutput,
              config,
@@ -561,7 +602,7 @@ describe('Manifest Utils', () => {
              command: 'build',
            });

-            const actual = await generateManifest(
+            const { manifest: actual } = await generateManifest(
              entrypoints,
              buildOutput,
              config,
@@ -604,7 +645,7 @@ describe('Manifest Utils', () => {
            manifestVersion: 3,
          });

-          const actual = await generateManifest(
+          const { manifest: actual } = await generateManifest(
            entrypoints,
            buildOutput,
            config,
@@ -646,7 +687,7 @@ describe('Manifest Utils', () => {
            manifestVersion: 2,
          });

-          const actual = await generateManifest(
+          const { manifest: actual } = await generateManifest(
            entrypoints,
            buildOutput,
            config,
@@ -685,7 +726,7 @@ describe('Manifest Utils', () => {
            manifestVersion: 3,
          });

-          const actual = await generateManifest(
+          const { manifest: actual } = await generateManifest(
            entrypoints,
            buildOutput,
            config,
@@ -735,7 +776,11 @@ describe('Manifest Utils', () => {
          },
        });

-        const actual = await generateManifest(entrypoints, buildOutput, config);
+        const { manifest: actual } = await generateManifest(
+          entrypoints,
+          buildOutput,
+          config,
+        );

        expect(actual.web_accessible_resources).toEqual([
          { resources: ['one.png'], matches: ['*://one.com/*'] },
@@ -777,7 +822,11 @@ describe('Manifest Utils', () => {
          },
        });

-        const actual = await generateManifest(entrypoints, buildOutput, config);
+        const { manifest: actual } = await generateManifest(
+          entrypoints,
+          buildOutput,
+          config,
+        );

        expect(actual.web_accessible_resources).toEqual([
          'one.png',
@@ -800,7 +849,11 @@ describe('Manifest Utils', () => {
          author: newAuthor,
        };

-        const actual = await generateManifest(entrypoints, buildOutput, config);
+        const { manifest: actual } = await generateManifest(
+          entrypoints,
+          buildOutput,
+          config,
+        );

        expect(actual).toMatchObject(expected);
      });
@@ -822,7 +875,7 @@ describe('Manifest Utils', () => {
            },
          });

-          const actual = await generateManifest(
+          const { manifest: actual } = await generateManifest(
            entrypoints,
            buildOutput,
            config,
@@ -848,7 +901,7 @@ describe('Manifest Utils', () => {
            },
          });

-          const actual = await generateManifest(
+          const { manifest: actual } = await generateManifest(
            entrypoints,
            buildOutput,
            config,
@@ -873,7 +926,7 @@ describe('Manifest Utils', () => {
            },
          });

-          const actual = await generateManifest(
+          const { manifest: actual } = await generateManifest(
            entrypoints,
            buildOutput,
            config,
@@ -894,7 +947,11 @@ describe('Manifest Utils', () => {
          },
        });

-        const actual = await generateManifest(entrypoints, buildOutput, config);
+        const { manifest: actual } = await generateManifest(
+          entrypoints,
+          buildOutput,
+          config,
+        );

        expect(actual.version).toBe('0.0.0');
        expect(actual.version_name).toBeUndefined();
@@ -908,6 +965,7 @@ describe('Manifest Utils', () => {
    describe('commands', () => {
      const reloadCommandName = 'wxt:reload-extension';
      const reloadCommand = {
+        description: expect.any(String),
        suggested_key: {
          default: 'Alt+R',
        },
@@ -918,21 +976,65 @@ describe('Manifest Utils', () => {
        const output = fakeBuildOutput();
        const entrypoints = fakeArray(fakeEntrypoint);

-        const actual = await generateManifest(entrypoints, output, config);
+        const { manifest: actual } = await generateManifest(
+          entrypoints,
+          output,
+          config,
+        );

-        expect(actual.commands).toMatchObject({
+        expect(actual.commands).toEqual({
          [reloadCommandName]: reloadCommand,
        });
      });

+      it('should customize the reload commands key binding if passing a custom command', async () => {
+        const config = fakeInternalConfig({
+          command: 'serve',
+          dev: {
+            reloadCommand: 'Ctrl+E',
+          },
+        });
+        const output = fakeBuildOutput();
+        const entrypoints = fakeArray(fakeEntrypoint);
+
+        const { manifest: actual } = await generateManifest(
+          entrypoints,
+          output,
+          config,
+        );
+
+        expect(actual.commands).toEqual({
+          [reloadCommandName]: {
+            ...reloadCommand,
+            suggested_key: {
+              default: 'Ctrl+E',
+            },
+          },
+        });
+      });
+
+      it("should not include the reload command when it's been disabled", async () => {
+        const config = fakeInternalConfig({
+          command: 'serve',
+          dev: {
+            reloadCommand: false,
+          },
+        });
+        const output = fakeBuildOutput();
+        const entrypoints = fakeArray(fakeEntrypoint);
+
+        const { manifest: actual } = await generateManifest(
+          entrypoints,
+          output,
+          config,
+        );
+
+        expect(actual.commands).toBeUndefined();
+      });
+
      it('should not override any existing commands when adding the one to reload the extension', async () => {
        const customCommandName = 'custom-command';
-        const customCommand = {
-          description: 'Some other command',
-          suggested_key: {
-            default: 'Ctrl+H',
-          },
-        };
+        const customCommand = fakeManifestCommand();
        const config = fakeInternalConfig({
          command: 'serve',
          manifest: {
@@ -944,20 +1046,52 @@ describe('Manifest Utils', () => {
        const output = fakeBuildOutput();
        const entrypoints = fakeArray(fakeEntrypoint);

-        const actual = await generateManifest(entrypoints, output, config);
+        const { manifest: actual } = await generateManifest(
+          entrypoints,
+          output,
+          config,
+        );

-        expect(actual.commands).toMatchObject({
+        expect(actual.commands).toEqual({
          [reloadCommandName]: reloadCommand,
          [customCommandName]: customCommand,
        });
      });

+      it('should not include the command if there are already 4 others (the max)', async () => {
+        const commands = {
+          command1: fakeManifestCommand(),
+          command2: fakeManifestCommand(),
+          command3: fakeManifestCommand(),
+          command4: fakeManifestCommand(),
+        };
+        const config = fakeInternalConfig({
+          command: 'serve',
+          manifest: { commands },
+        });
+        const output = fakeBuildOutput();
+        const entrypoints = fakeArray(fakeEntrypoint);
+
+        const { manifest: actual, warnings } = await generateManifest(
+          entrypoints,
+          output,
+          config,
+        );
+
+        expect(actual.commands).toEqual(commands);
+        expect(warnings).toHaveLength(1);
+      });
+
      it('should not include the command when building an extension', async () => {
        const config = fakeInternalConfig({ command: 'build' });
        const output = fakeBuildOutput();
        const entrypoints = fakeArray(fakeEntrypoint);

-        const actual = await generateManifest(entrypoints, output, config);
+        const { manifest: actual } = await generateManifest(
+          entrypoints,
+          output,
+          config,
+        );

        expect(actual.commands).toBeUndefined();
      });
@@ -0,0 +1,100 @@
+import { describe, it, expect } from 'vitest';
+import {
+  fakeArray,
+  fakeContentScriptEntrypoint,
+  fakeEntrypoint,
+  fakeGenericEntrypoint,
+} from '../testing/fake-objects';
+import { validateEntrypoints } from '../validation';
+
+describe('Validation Utils', () => {
+  describe('validateEntrypoints', () => {
+    it('should return no errors when there are no errors', () => {
+      const entrypoints = fakeArray(fakeEntrypoint);
+      const expected = {
+        errors: [],
+        errorCount: 0,
+        warningCount: 0,
+      };
+
+      const actual = validateEntrypoints(entrypoints);
+
+      expect(actual).toEqual(expected);
+    });
+
+    it('should return an error when exclude is not an array', () => {
+      const entrypoint = fakeGenericEntrypoint({
+        options: {
+          // @ts-expect-error
+          exclude: 0,
+        },
+      });
+      const expected = {
+        errors: [
+          {
+            type: 'error',
+            message: '`exclude` must be an array of browser names',
+            value: 0,
+            entrypoint,
+          },
+        ],
+        errorCount: 1,
+        warningCount: 0,
+      };
+
+      const actual = validateEntrypoints([entrypoint]);
+
+      expect(actual).toEqual(expected);
+    });
+
+    it('should return an error when include is not an array', () => {
+      const entrypoint = fakeGenericEntrypoint({
+        options: {
+          // @ts-expect-error
+          include: 0,
+        },
+      });
+      const expected = {
+        errors: [
+          {
+            type: 'error',
+            message: '`include` must be an array of browser names',
+            value: 0,
+            entrypoint,
+          },
+        ],
+        errorCount: 1,
+        warningCount: 0,
+      };
+
+      const actual = validateEntrypoints([entrypoint]);
+
+      expect(actual).toEqual(expected);
+    });
+
+    it("should return an error when content scripts don't have a matches", () => {
+      const entrypoint = fakeContentScriptEntrypoint({
+        options: {
+          // @ts-expect-error
+          matches: null,
+        },
+      });
+      const expected = {
+        errors: [
+          {
+            type: 'error',
+            message: '`matches` is required',
+            value: null,
+            entrypoint,
+          },
+        ],
+        errorCount: 1,
+        warningCount: 0,
+      };
+
+      const actual = validateEntrypoints([entrypoint]);
+
+      expect(actual).toEqual(expected);
+    });
+  });
+});
@@ -9,3 +9,15 @@ export function every<T>(
    if (!predicate(array[i], i)) return false;
  return true;
 }
+
+/**
+ * Returns true when any of the predicates return true;
+ */
+export function some<T>(
+  array: T[],
+  predicate: (item: T, index: number) => boolean,
+): boolean {
+  for (let i = 0; i < array.length; i++)
+    if (predicate(array[i], i)) return true;
+  return false;
+}
@@ -10,22 +10,15 @@ import {
  fakePopupEntrypoint,
  fakeOutputAsset,
  fakeOutputChunk,
+  fakeInternalConfig,
 } from '~/core/utils/testing/fake-objects';
 import { BuildOutput, BuildStepOutput } from '~/types';

 describe('Detect Dev Changes', () => {
  describe('No changes', () => {
-    it("should return 'no-change' when a build hasn't finished", () => {
-      const actual = detectDevChanges(
-        [['unknown', '/path/to/file.ts']],
-        undefined,
-      );
-
-      expect(actual).toEqual({ type: 'no-change' });
-    });
-
    it("should return 'no-change' when the changed file isn't used by any of the entrypoints", () => {
-      const change: [string, string] = ['unknown', '/some/path.ts'];
+      const config = fakeInternalConfig();
+      const changes = ['/some/path.ts'];
      const currentOutput: BuildOutput = {
        manifest: fakeManifest(),
        publicAssets: [],
@@ -41,18 +34,64 @@ describe('Detect Dev Changes', () => {
        ],
      };

-      const actual = detectDevChanges([change], currentOutput);
+      const actual = detectDevChanges(config, changes, currentOutput);

      expect(actual).toEqual({ type: 'no-change' });
    });
  });

+  describe('wxt.config.ts', () => {
+    it("should return 'full-restart' when one of the changed files is the config file", () => {
+      const configFile = '/root/wxt.config.ts';
+      const config = fakeInternalConfig({
+        userConfigMetadata: {
+          configFile,
+        },
+      });
+      const changes = ['/root/src/public/image.svg', configFile];
+      const currentOutput: BuildOutput = {
+        manifest: fakeManifest(),
+        publicAssets: [],
+        steps: [],
+      };
+      const expected: DevModeChange = {
+        type: 'full-restart',
+      };
+
+      const actual = detectDevChanges(config, changes, currentOutput);
+
+      expect(actual).toEqual(expected);
+    });
+  });
+
+  describe('web-ext.config.ts', () => {
+    it("should return 'browser-restart' when one of the changed files is the config file", () => {
+      const runnerFile = '/root/web-ext.config.ts';
+      const config = fakeInternalConfig({
+        runnerConfig: {
+          configFile: runnerFile,
+        },
+      });
+      const changes = ['/root/src/public/image.svg', runnerFile];
+      const currentOutput: BuildOutput = {
+        manifest: fakeManifest(),
+        publicAssets: [],
+        steps: [],
+      };
+      const expected: DevModeChange = {
+        type: 'browser-restart',
+      };
+
+      const actual = detectDevChanges(config, changes, currentOutput);
+
+      expect(actual).toEqual(expected);
+    });
+  });
+
  describe('Public Assets', () => {
    it("should return 'extension-reload' without any groups to rebuild when the changed file is a public asset", () => {
-      const change: [string, string] = [
-        'unknown',
-        '/root/src/public/image.svg',
-      ];
+      const config = fakeInternalConfig();
+      const changes = ['/root/src/public/image.svg'];
      const asset1 = fakeOutputAsset({
        fileName: 'image.svg',
      });
@@ -73,7 +112,7 @@ describe('Detect Dev Changes', () => {
        },
      };

-      const actual = detectDevChanges([change], currentOutput);
+      const actual = detectDevChanges(config, changes, currentOutput);

      expect(actual).toEqual(expected);
    });
@@ -81,6 +120,7 @@ describe('Detect Dev Changes', () => {

  describe('Background', () => {
    it("should rebuild the background and reload the extension when the changed file in it's chunks' `moduleIds` field", () => {
+      const config = fakeInternalConfig();
      const changedPath = '/root/utils/shared.ts';
      const contentScript = fakeContentScriptEntrypoint({
        inputPath: '/root/overlay.content.ts',
@@ -120,10 +160,7 @@ describe('Detect Dev Changes', () => {
        rebuildGroups: [background],
      };

-      const actual = detectDevChanges(
-        [['unknown', changedPath]],
-        currentOutput,
-      );
+      const actual = detectDevChanges(config, [changedPath], currentOutput);

      expect(actual).toEqual(expected);
    });
@@ -131,6 +168,7 @@ describe('Detect Dev Changes', () => {

  describe('HTML Pages', () => {
    it('should rebuild then reload only the effected pages', async () => {
+      const config = fakeInternalConfig();
      const changedPath = '/root/page1/index.html';
      const htmlPage1 = fakePopupEntrypoint({
        inputPath: changedPath,
@@ -174,10 +212,7 @@ describe('Detect Dev Changes', () => {
        rebuildGroups: [[htmlPage1, htmlPage2]],
      };

-      const actual = detectDevChanges(
-        [['unknown', changedPath]],
-        currentOutput,
-      );
+      const actual = detectDevChanges(config, [changedPath], currentOutput);

      expect(actual).toEqual(expected);
    });
@@ -185,6 +220,7 @@ describe('Detect Dev Changes', () => {

  describe('Content Scripts', () => {
    it('should rebuild then reload only the effected content scripts', async () => {
+      const config = fakeInternalConfig();
      const changedPath = '/root/utils/shared.ts';
      const script1 = fakeContentScriptEntrypoint({
        inputPath: '/root/overlay1.content/index.ts',
@@ -236,10 +272,7 @@ describe('Detect Dev Changes', () => {
        rebuildGroups: [script1, script3],
      };

-      const actual = detectDevChanges(
-        [['unknown', changedPath]],
-        currentOutput,
-      );
+      const actual = detectDevChanges(config, [changedPath], currentOutput);

      expect(actual).toEqual(expected);
    });
@@ -18,12 +18,15 @@ export async function buildEntrypoints(
  const steps: BuildStepOutput[] = [];
  for (let i = 0; i < groups.length; i++) {
    const group = groups[i];
-    const groupNames = [group]
-      .flat()
-      .map((e) => e.name)
-      .join(pc.dim(', '));
-    spinner.text = pc.dim(`[${i + 1}/${groups.length}]`) + ` ${groupNames}`;
-    steps.push(await config.builder.build(group));
+    const groupNames = [group].flat().map((e) => e.name);
+    const groupNameColored = groupNames.join(pc.dim(', '));
+    spinner.text =
+      pc.dim(`[${i + 1}/${groups.length}]`) + ` ${groupNameColored}`;
+    try {
+      steps.push(await config.builder.build(group));
+    } catch (err) {
+      throw Error(`Failed to build ${groupNames.join(', ')}`, { cause: err });
+    }
  }
  const publicAssets = await copyPublicDirectory(config);

@@ -2,10 +2,11 @@ import {
  BuildOutput,
  BuildStepOutput,
  EntrypointGroup,
+  InternalConfig,
  OutputAsset,
  OutputFile,
 } from '~/types';
-import { every } from '~/core/utils/arrays';
+import { every, some } from '~/core/utils/arrays';
 import { normalizePath } from '~/core/utils/paths';

 /**
@@ -29,10 +30,21 @@ import { normalizePath } from '~/core/utils/paths';
 *   - Config file changed (wxt.config.ts, .env, web-ext.config.ts, etc)
 */
 export function detectDevChanges(
-  changedFiles: [event: string, path: string][],
-  currentOutput: BuildOutput | undefined,
+  config: InternalConfig,
+  changedFiles: string[],
+  currentOutput: BuildOutput,
 ): DevModeChange {
-  if (currentOutput == null) return { type: 'no-change' };
+  const isConfigChange = some(
+    changedFiles,
+    (file) => file === config.userConfigMetadata.configFile,
+  );
+  if (isConfigChange) return { type: 'full-restart' };
+
+  const isRunnerChange = some(
+    changedFiles,
+    (file) => file === config.runnerConfig.configFile,
+  );
+  if (isRunnerChange) return { type: 'browser-restart' };

  const changedSteps = new Set(
    changedFiles.flatMap((changedFile) =>
@@ -69,7 +81,7 @@ export function detectDevChanges(

  const isOnlyHtmlChanges =
    changedFiles.length > 0 &&
-    every(changedFiles, ([_, file]) => file.endsWith('.html'));
+    every(changedFiles, (file) => file.endsWith('.html'));
  if (isOnlyHtmlChanges) {
    return {
      type: 'html-reload',
@@ -104,11 +116,11 @@ export function detectDevChanges(
 * For a single change, return all the step of the build output that were effected by it.
 */
 function findEffectedSteps(
-  changedFile: [event: string, path: string],
+  changedFile: string,
  currentOutput: BuildOutput,
 ): DetectedChange[] {
  const changes: DetectedChange[] = [];
-  const changedPath = normalizePath(changedFile[1]);
+  const changedPath = normalizePath(changedFile);

  const isChunkEffected = (chunk: OutputFile): boolean =>
    // If it's an HTML file with the same path, is is effected because HTML files need to be pre-rendered
@@ -139,8 +151,9 @@ export type DevModeChange =
  | NoChange
  | HtmlReload
  | ExtensionReload
-  | ContentScriptReload;
-// | BrowserRestart
+  | ContentScriptReload
+  | FullRestart
+  | BrowserRestart;

 interface NoChange {
  type: 'no-change';
@@ -157,6 +170,14 @@ interface RebuildChange {
  cachedOutput: BuildOutput;
 }

+interface FullRestart {
+  type: 'full-restart';
+}
+
+interface BrowserRestart {
+  type: 'browser-restart';
+}
+
 interface HtmlReload extends RebuildChange {
  type: 'html-reload';
 }
@@ -136,7 +136,7 @@ declare module "wxt/browser" {

  const overrides = messages.map((message) => {
    return `    /**
-     * ${message.description ?? 'No message description.'}
+     * ${message.description || 'No message description.'}
     *
     * "${message.message}"
     */
@@ -164,8 +164,11 @@ async function writeGlobalsDeclarationFile(
    [
      '// Generated by wxt',
      'export {}',
-      'declare global {',
-      ...globals.map((global) => `  const ${global.name}: ${global.type};`),
+      'interface ImportMetaEnv {',
+      ...globals.map((global) => `  readonly ${global.name}: ${global.type};`),
+      '}',
+      'interface ImportMeta {',
+      '  readonly env: ImportMetaEnv',
      '}',
    ].join('\n') + '\n',
  );
@@ -79,6 +79,7 @@ export async function getInternalConfig(
  const typesDir = path.resolve(wxtDir, 'types');
  const outBaseDir = path.resolve(root, mergedConfig.outDir ?? '.output');
  const outDir = path.resolve(outBaseDir, `${browser}-mv${manifestVersion}`);
+  const reloadCommand = mergedConfig.dev?.reloadCommand ?? 'Alt+R';

  const runnerConfig = await loadConfig<ExtensionRunnerConfig>({
    name: 'web-ext',
@@ -136,6 +137,9 @@ export async function getInternalConfig(
        mergedConfig.experimental?.includeBrowserPolyfill ?? true,
    },
    server,
+    dev: {
+      reloadCommand,
+    },
  };

  const builder = await createViteBuilder(
@@ -221,6 +225,10 @@ function mergeInlineConfig(
    },
    vite: undefined,
    transformManifest: undefined,
+    dev: {
+      ...userConfig.dev,
+      ...inlineConfig.dev,
+    },
  };
 }

@@ -233,8 +241,9 @@ function resolveInternalZipConfig(
    sourcesTemplate: '{{name}}-{{version}}-sources.zip',
    artifactTemplate: '{{name}}-{{version}}-{{browser}}.zip',
    sourcesRoot: root,
+    includeSources: [],
    ...mergedConfig.zip,
-    ignoredSources: [
+    excludeSources: [
      '**/node_modules',
      // WXT files
      '**/web-ext.config.ts',
@@ -244,7 +253,7 @@ function resolveInternalZipConfig(
      '**/__tests__/**',
      '**/*.+(test|spec).?(c|m)+(j|t)s?(x)',
      // From user
-      ...(mergedConfig.zip?.ignoredSources ?? []),
+      ...(mergedConfig.zip?.excludeSources ?? []),
    ],
  };
 }
@@ -89,16 +89,17 @@ export async function importEntrypointFile<T>(
    const res = await jiti(path);
    return res.default;
  } catch (err) {
+    const filePath = relative(config.root, path);
    if (err instanceof ReferenceError) {
      // "XXX is not defined" - usually due to WXT removing imports
      const variableName = err.message.replace(' is not defined', '');
-      const filePath = relative(config.root, path);
      throw Error(
        `${filePath}: Cannot use imported variable "${variableName}" outside the main function. See https://wxt.dev/guide/entrypoints.html#side-effects`,
        { cause: err },
      );
    } else {
-      throw err;
+      config.logger.error(err);
+      throw Error(`Failed to load entrypoint: ${filePath}`, { cause: err });
    }
  }
 }
@@ -1,5 +1,5 @@
 import { findEntrypoints } from './find-entrypoints';
-import { InternalConfig, BuildOutput } from '~/types';
+import { InternalConfig, BuildOutput, Entrypoint } from '~/types';
 import pc from 'picocolors';
 import fs from 'fs-extra';
 import { groupEntrypoints } from './group-entrypoints';
@@ -8,6 +8,15 @@ import { printBuildSummary } from '~/core/utils/log';
 import glob from 'fast-glob';
 import { unnormalizePath } from '~/core/utils/paths';
 import { rebuild } from './rebuild';
+import managePath from 'manage-path';
+import { resolve, relative } from 'node:path';
+import {
+  ValidationError,
+  ValidationResult,
+  ValidationResults,
+  validateEntrypoints,
+} from '../validation';
+import consola from 'consola';

 /**
 * Builds the extension based on an internal config. No more config discovery is performed, the
@@ -37,8 +46,24 @@ export async function internalBuild(

  const entrypoints = await findEntrypoints(config);
  config.logger.debug('Detected entrypoints:', entrypoints);
+
+  const validationResults = validateEntrypoints(entrypoints);
+  if (validationResults.errorCount + validationResults.warningCount > 0) {
+    printValidationResults(config, validationResults);
+  }
+  if (validationResults.errorCount > 0) {
+    throw new ValidationError(`Entrypoint validation failed`, {
+      cause: validationResults,
+    });
+  }
+
  const groups = groupEntrypoints(entrypoints);
-  const { output } = await rebuild(config, entrypoints, groups, undefined);
+  const { output, warnings } = await rebuild(
+    config,
+    entrypoints,
+    groups,
+    undefined,
+  );

  // Post-build
  await printBuildSummary(
@@ -48,6 +73,10 @@ export async function internalBuild(
    config,
  );

+  for (const warning of warnings) {
+    config.logger.warn(...warning);
+  }
+
  if (config.analysis.enabled) {
    await combineAnalysisStats(config);
    config.logger.info(
@@ -66,6 +95,10 @@ async function combineAnalysisStats(config: InternalConfig): Promise<void> {
  });
  const absolutePaths = unixFiles.map(unnormalizePath);

+  const alterPath = managePath(process.env);
+  // Add subdependency path for PNPM shamefully-hoist=false
+  alterPath.push(resolve(config.root, 'node_modules/wxt/node_modules/.bin'));
+
  await execaCommand(
    `rollup-plugin-visualizer ${absolutePaths.join(' ')} --template ${
      config.analysis.template
@@ -73,3 +106,33 @@ async function combineAnalysisStats(config: InternalConfig): Promise<void> {
    { cwd: config.root, stdio: 'inherit' },
  );
 }
+
+function printValidationResults(
+  config: InternalConfig,
+  { errorCount, errors, warningCount }: ValidationResults,
+) {
+  (errorCount > 0 ? config.logger.error : config.logger.warn)(
+    `Entrypoint validation failed: ${errorCount} error${
+      errorCount === 1 ? '' : 's'
+    }, ${warningCount} warning${warningCount === 1 ? '' : 's'}`,
+  );
+
+  const cwd = process.cwd();
+  const entrypointErrors = errors.reduce((map, error) => {
+    const entryErrors = map.get(error.entrypoint) ?? [];
+    entryErrors.push(error);
+    map.set(error.entrypoint, entryErrors);
+    return map;
+  }, new Map<Entrypoint, ValidationResult[]>());
+
+  Array.from(entrypointErrors.entries()).forEach(([entrypoint, errors]) => {
+    consola.log(relative(cwd, entrypoint.inputPath));
+    console.log();
+    errors.forEach((err) => {
+      const type = err.type === 'error' ? pc.red('ERROR') : pc.yellow('WARN');
+      const recieved = pc.dim(`(recieved: ${JSON.stringify(err.value)})`);
+      consola.log(`  - ${type} ${err.message} ${recieved}`);
+    });
+    console.log();
+  });
+}
@@ -33,7 +33,11 @@ export async function rebuild(
    steps: [],
    publicAssets: [],
  },
-): Promise<{ output: BuildOutput; manifest: Manifest.WebExtensionManifest }> {
+): Promise<{
+  output: BuildOutput;
+  manifest: Manifest.WebExtensionManifest;
+  warnings: any[][];
+}> {
  const { default: ora } = await import('ora');
  const spinner = ora(`Preparing...`).start();

@@ -51,11 +55,8 @@ export async function rebuild(
    publicAssets: [...existingOutput.publicAssets, ...newOutput.publicAssets],
  };

-  const newManifest = await generateManifest(
-    allEntrypoints,
-    mergedOutput,
-    config,
-  );
+  const { manifest: newManifest, warnings: manifestWarnings } =
+    await generateManifest(allEntrypoints, mergedOutput, config);
  const finalOutput: BuildOutput = {
    manifest: newManifest,
    ...newOutput,
@@ -77,5 +78,6 @@ export async function rebuild(
      ],
    },
    manifest: newManifest,
+    warnings: manifestWarnings,
  };
 }
@@ -5,42 +5,42 @@ export function getGlobals(
 ): Array<{ name: string; value: any; type: string }> {
  return [
    {
-      name: surroundInUnderscore('MANIFEST_VERSION'),
+      name: 'MANIFEST_VERSION',
      value: config.manifestVersion,
      type: `2 | 3`,
    },
    {
-      name: surroundInUnderscore('BROWSER'),
+      name: 'BROWSER',
      value: config.browser,
      type: `string`,
    },
    {
-      name: surroundInUnderscore('IS_CHROME'),
+      name: 'CHROME',
      value: config.browser === 'chrome',
      type: `boolean`,
    },
    {
-      name: surroundInUnderscore('IS_FIREFOX'),
+      name: 'FIREFOX',
      value: config.browser === 'firefox',
      type: `boolean`,
    },
    {
-      name: surroundInUnderscore('IS_SAFARI'),
+      name: 'SAFARI',
      value: config.browser === 'safari',
      type: `boolean`,
    },
    {
-      name: surroundInUnderscore('IS_EDGE'),
+      name: 'EDGE',
      value: config.browser === 'edge',
      type: `boolean`,
    },
    {
-      name: surroundInUnderscore('IS_OPERA'),
+      name: 'OPERA',
      value: config.browser === 'opera',
      type: `boolean`,
    },
    {
-      name: surroundInUnderscore('COMMAND'),
+      name: 'COMMAND',
      value: config.command,
      type: `"build" | "serve"`,
    },
@@ -50,17 +50,9 @@ export function getGlobals(
 export function getEntrypointGlobals(entrypointName: string) {
  return [
    {
-      name: surroundInUnderscore('ENTRYPOINT'),
+      name: 'ENTRYPOINT',
      value: entrypointName,
      type: `string`,
    },
  ];
 }
-
-/**
- * Don't hardcode the complete name so that the string litterals in this file aren't replaced during
- * tests (which causes syntax errors), only during builds.
- */
-function surroundInUnderscore(name: string): string {
-  return `__${name}__`;
-}
@@ -54,7 +54,8 @@ export async function generateManifest(
  entrypoints: Entrypoint[],
  buildOutput: Omit<BuildOutput, 'manifest'>,
  config: InternalConfig,
-): Promise<Manifest.WebExtensionManifest> {
+): Promise<{ manifest: Manifest.WebExtensionManifest; warnings: any[][] }> {
+  const warnings: any[][] = [];
  const pkg = await getPackageJson(config);

  let versionName =
@@ -75,16 +76,6 @@ export async function generateManifest(
    short_name: pkg?.shortName,
    icons: discoverIcons(buildOutput),
  };
-  if (config.command === 'serve') {
-    baseManifest.commands = {
-      'wxt:reload-extension': {
-        description: 'Reload the extension during development',
-        suggested_key: {
-          default: 'Alt+R',
-        },
-      },
-    };
-  }
  const userManifest = config.manifest;

  const manifest = defu(
@@ -92,6 +83,23 @@ export async function generateManifest(
    baseManifest,
  ) as Manifest.WebExtensionManifest;

+  // Add reload command in dev mode
+  if (config.command === 'serve' && config.dev.reloadCommand) {
+    if (manifest.commands && Object.keys(manifest.commands).length >= 4) {
+      warnings.push([
+        "Extension already has 4 registered commands, WXT's reload command is disabled",
+      ]);
+    } else {
+      manifest.commands ??= {};
+      manifest.commands['wxt:reload-extension'] = {
+        description: 'Reload the extension during development',
+        suggested_key: {
+          default: config.dev.reloadCommand,
+        },
+      };
+    }
+  }
+
  // Apply the final version fields after merging the user manifest
  manifest.version = version;
  manifest.version_name =
@@ -117,7 +125,10 @@ export async function generateManifest(
    );
  }

-  return finalManifest;
+  return {
+    manifest: finalManifest,
+    warnings,
+  };
 }

 /**
@@ -4,7 +4,7 @@
 import { resolve } from 'path';
 import { faker } from '@faker-js/faker';
 import merge from 'lodash.merge';
-import type { Manifest } from '~/browser';
+import { Commands, type Manifest } from '~/browser';
 import {
  FsCache,
  InternalConfig,
@@ -232,7 +232,8 @@ export const fakeInternalConfig = fakeObjectCreator<InternalConfig>(() => {
    },
    zip: {
      artifactTemplate: '{{name}}-{{version}}.zip',
-      ignoredSources: [],
+      includeSources: [],
+      excludeSources: [],
      sourcesRoot: fakeDir(),
      sourcesTemplate: '{{name}}-sources.zip',
      name: faker.person.firstName().toLowerCase(),
@@ -244,6 +245,9 @@ export const fakeInternalConfig = fakeObjectCreator<InternalConfig>(() => {
      includeBrowserPolyfill: true,
    },
    builder: mock(),
+    dev: {
+      reloadCommand: 'Alt+R',
+    },
  };
 });

@@ -257,3 +261,11 @@ export const fakeBuildStepOutput = fakeObjectCreator<BuildStepOutput>(() => ({
  chunks: fakeArray(fakeOutputChunk),
  entrypoints: fakeArray(fakeEntrypoint),
 }));
+
+export const fakeManifestCommand = fakeObjectCreator<Commands.Command>(() => ({
+  description: faker.string.sample(),
+  shortcut: `${faker.helpers.arrayElement(['ctrl', 'alt'])}+${faker.number.int({
+    min: 0,
+    max: 9,
+  })}`,
+}));
@@ -0,0 +1,86 @@
+import { ContentScriptEntrypoint, Entrypoint } from '~/types';
+
+export function validateEntrypoints(
+  entrypoints: Entrypoint[],
+): ValidationResults {
+  const errors = entrypoints.flatMap((entrypoint) => {
+    switch (entrypoint.type) {
+      case 'content-script':
+        return validateContentScriptEntrypoint(entrypoint);
+      default:
+        return validateBaseEntrypoint(entrypoint);
+    }
+  });
+
+  let errorCount = 0;
+  let warningCount = 0;
+  for (const err of errors) {
+    if (err.type === 'warning') warningCount++;
+    else errorCount++;
+  }
+
+  return {
+    errors,
+    errorCount,
+    warningCount,
+  };
+}
+
+function validateContentScriptEntrypoint(
+  definition: ContentScriptEntrypoint,
+): ValidationResult[] {
+  const errors = validateBaseEntrypoint(definition);
+  if (definition.options.matches == null) {
+    errors.push({
+      type: 'error',
+      message: '`matches` is required',
+      value: definition.options.matches,
+      entrypoint: definition,
+    });
+  }
+  return errors;
+}
+
+function validateBaseEntrypoint(definition: Entrypoint): ValidationResult[] {
+  const errors: ValidationResult[] = [];
+
+  if (
+    definition.options.exclude != null &&
+    !Array.isArray(definition.options.exclude)
+  ) {
+    errors.push({
+      type: 'error',
+      message: '`exclude` must be an array of browser names',
+      value: definition.options.exclude,
+      entrypoint: definition,
+    });
+  }
+  if (
+    definition.options.include != null &&
+    !Array.isArray(definition.options.include)
+  ) {
+    errors.push({
+      type: 'error',
+      message: '`include` must be an array of browser names',
+      value: definition.options.include,
+      entrypoint: definition,
+    });
+  }
+
+  return errors;
+}
+
+export interface ValidationResult {
+  type: 'warning' | 'error';
+  message: string;
+  entrypoint: Entrypoint;
+  value: any;
+}
+
+export interface ValidationResults {
+  errors: ValidationResult[];
+  errorCount: number;
+  warningCount: number;
+}
+
+export class ValidationError extends Error {}
@@ -62,10 +62,15 @@ export async function zip(config?: InlineConfig): Promise<string[]> {
      saveTo: sourcesZipPath,
      filter(path) {
        const relativePath = relative(internalConfig.zip.sourcesRoot, path);
-        const matchedPattern = internalConfig.zip.ignoredSources.find(
-          (pattern) => minimatch(relativePath, pattern),
+
+        return (
+          internalConfig.zip.includeSources.some((pattern) =>
+            minimatch(relativePath, pattern),
+          ) ||
+          !internalConfig.zip.excludeSources.some((pattern) =>
+            minimatch(relativePath, pattern),
+          )
        );
-        return matchedPattern == null;
      },
    });
    zipFiles.push(sourcesZipPath);
@@ -308,10 +308,20 @@ function createDriver(
  storageArea: 'local' | 'session' | 'sync' | 'managed',
 ): WxtStorageDriver {
  const getStorageArea = () => {
-    if (browser.storage == null)
+    if (browser.runtime == null) {
+      throw Error(
+        [
+          "'wxt/storage' must be loaded in a web extension environment",
+          '\n - If thrown during a build, see https://github.com/wxt-dev/wxt/issues/371',
+          " - If thrown during tests, mock 'wxt/browser' correctly. See https://wxt.dev/guide/testing.html\n",
+        ].join('\n'),
+      );
+    }
+    if (browser.storage == null) {
      throw Error(
        "You must add the 'storage' permission to your manifest to use 'wxt/storage'",
      );
+    }

    return browser.storage[storageArea];
  };
@@ -143,9 +143,22 @@ export interface InlineConfig {
     * @default config.root
     */
    sourcesRoot?: string;
+    /**
+     * [Minimatch](https://www.npmjs.com/package/minimatch) patterns of files to include when
+     * creating a ZIP of all your source code for Firefox. Patterns are relative to your
+     * `config.zip.sourcesRoot`.
+     *
+     * This setting overrides `excludeSources`. So if a file matches both lists, it is included in the ZIP.
+     *
+     * @example
+     * [
+     *   "coverage", // Ignore the coverage directory in the `sourcesRoot`
+     * ]
+     */
+    includeSources?: string[];
    /**
     * [Minimatch](https://www.npmjs.com/package/minimatch) patterns of files to exclude when
-     * creating a ZIP of all your source code for Firfox. Patterns are relative to your
+     * creating a ZIP of all your source code for Firefox. Patterns are relative to your
     * `config.zip.sourcesRoot`.
     *
     * Hidden files, node_modules, and tests are ignored by default.
@@ -155,7 +168,7 @@ export interface InlineConfig {
     *   "coverage", // Ignore the coverage directory in the `sourcesRoot`
     * ]
     */
-    ignoredSources?: string[];
+    excludeSources?: string[];
  };

  /**
@@ -229,6 +242,24 @@ export interface InlineConfig {
     */
    includeBrowserPolyfill?: boolean;
  };
+  /**
+   * Config effecting dev mode only.
+   */
+  dev?: {
+    /**
+     * Controls whether a custom keyboard shortcut command, `Alt+R`, is added during dev mode to
+     * quickly reload the extension.
+     *
+     * If false, the shortcut is not added during development.
+     *
+     * If set to a custom string, you can override the key combo used. See
+     * [Chrome's command docs](https://developer.chrome.com/docs/extensions/reference/api/commands)
+     * for available options.
+     *
+     * @default "Alt+R"
+     */
+    reloadCommand?: string | false;
+  };
 }

 // TODO: Extract to @wxt/vite-builder and use module augmentation to include the vite field
@@ -290,16 +321,24 @@ export interface BuildStepOutput {
 }

 export interface WxtDevServer
-  extends Omit<WxtBuilderServer, 'listen'>,
+  extends Omit<WxtBuilderServer, 'listen' | 'close'>,
    ServerInfo {
  /**
   * Stores the current build output of the server.
   */
-  currentOutput: BuildOutput;
+  currentOutput: BuildOutput | undefined;
  /**
   * Start the server.
   */
  start(): Promise<void>;
+  /**
+   * Stop the server.
+   */
+  stop(): Promise<void>;
+  /**
+   * Close the browser, stop the server, rebuild the entire extension, and start the server again.
+   */
+  restart(): Promise<void>;
  /**
   * Transform the HTML for dev mode.
   */
@@ -332,6 +371,10 @@ export interface WxtDevServer
  reloadContentScript: (
    contentScript: Omit<Scripting.RegisteredContentScript, 'id'>,
  ) => void;
+  /**
+   * Grab the latest runner config and restart the browser.
+   */
+  restartBrowser: () => void;
 }

 export type TargetBrowser = string;
@@ -674,6 +717,10 @@ export interface WxtBuilderServer {
   * Start the server.
   */
  listen(): Promise<void>;
+  /**
+   * Stop the server.
+   */
+  close(): Promise<void>;
  /**
   * Transform the HTML for dev mode.
   */
@@ -1,7 +1,10 @@
-// Globals defined by the vite-plugins/devServerGlobals.ts and utils/globals.ts
-declare const __COMMAND__: 'build' | 'serve';
 declare const __DEV_SERVER_PROTOCOL__: string;
 declare const __DEV_SERVER_HOSTNAME__: string;
 declare const __DEV_SERVER_PORT__: string;
-declare const __MANIFEST_VERSION__: 2 | 3;
-declare const __ENTRYPOINT__: string;
+
+// Globals defined by the vite-plugins/devServerGlobals.ts and utils/globals.ts
+interface ImportMetaEnv {
+  readonly COMMAND: 'build' | 'serve';
+  readonly MANIFEST_VERSION: 2 | 3;
+  readonly ENTRYPOINT: string;
+}
@@ -40,7 +40,8 @@ export interface InternalConfig {
    name?: string;
    artifactTemplate: string;
    sourcesTemplate: string;
-    ignoredSources: string[];
+    includeSources: string[];
+    excludeSources: string[];
    sourcesRoot: string;
  };
  transformManifest: (manifest: Manifest.WebExtensionManifest) => void;
@@ -57,6 +58,9 @@ export interface InternalConfig {
    includeBrowserPolyfill: boolean;
  };
  builder: WxtBuilder;
+  dev: {
+    reloadCommand: string | false;
+  };
 }

 export interface FsCache {
@@ -50,6 +50,10 @@ declare module 'web-ext-run/util/logger' {
  export const consoleStream: IConsoleStream;
 }

+declare module 'manage-path' {
+  export default function managePath(env: object): string[];
+}
+
 declare module 'wxt/browser' {
  // Overridden when types are generated per project
  export type PublicPath = string;
@@ -5,7 +5,7 @@ import { browser } from 'wxt/browser';
 import { keepServiceWorkerAlive } from './utils/keep-service-worker-alive';
 import { reloadContentScript } from './utils/reload-content-scripts';

-if (__COMMAND__ === 'serve') {
+if (import.meta.env.COMMAND === 'serve') {
  try {
    const ws = setupWebSocket((message) => {
      if (message.event === 'wxt:reload-extension') browser.runtime.reload();
@@ -13,7 +13,7 @@ if (__COMMAND__ === 'serve') {
        reloadContentScript(message.data);
    });

-    if (__MANIFEST_VERSION__ === 3) {
+    if (import.meta.env.MANIFEST_VERSION === 3) {
      // Tell the server the background script is loaded and ready to go
      ws.addEventListener('open', () => {
        const msg = { type: 'custom', event: 'wxt:background-initialized' };
@@ -5,12 +5,12 @@ import { ContentScriptContext } from 'wxt/client';
 (async () => {
  try {
    const { main, ...options } = definition;
-    const ctx = new ContentScriptContext(__ENTRYPOINT__, options);
+    const ctx = new ContentScriptContext(import.meta.env.ENTRYPOINT, options);

    await main(ctx);
  } catch (err) {
    logger.error(
-      `The content script "${__ENTRYPOINT__}" crashed on startup!`,
+      `The content script "${import.meta.env.ENTRYPOINT}" crashed on startup!`,
      err,
    );
  }
@@ -7,7 +7,7 @@ import { logger } from '../sandbox/utils/logger';
    await main();
  } catch (err) {
    logger.error(
-      `The content script "${__ENTRYPOINT__}" crashed on startup!`,
+      `The content script "${import.meta.env.ENTRYPOINT}" crashed on startup!`,
      err,
    );
  }
@@ -1,7 +1,7 @@
 import { logger } from '../sandbox/utils/logger';
 import { setupWebSocket } from './utils/setup-web-socket';

-if (__COMMAND__ === 'serve') {
+if (import.meta.env.COMMAND === 'serve') {
  try {
    setupWebSocket((message) => {
      if (message.event === 'wxt:reload-page') {
@@ -6,7 +6,7 @@ import { logger } from '../sandbox/utils/logger';
    await definition.main();
  } catch (err) {
    logger.error(
-      `The unlisted script "${__ENTRYPOINT__}" crashed on startup!`,
+      `The unlisted script "${import.meta.env.ENTRYPOINT}" crashed on startup!`,
      err,
    );
  }
Author	SHA1	Message	Date
GitHub Actions	5e60f37ec5	chore(release): v0.15.0	2024-01-29 17:18:38 +00:00
Aaron	6f901b32eb	fix: Enable inline sourcemaps by default during development (#382 )	2024-01-29 11:15:57 -06:00
Aaron	927aca612e	fix!: Move browser constants to `import.meta.env` (#380 ) BREAKING CHANGE: Renamed undocumented constants: - `__BROWSER__` → `import.meta.env.BROWSER` - `__COMMAND__` → `import.meta.env.COMMAND` - `__MANIFEST_VERSION__` → `import.meta.env.MANIFEST_VERSION` - `__IS_CHROME__` → `import.meta.env.CHROME` - `__IS_FIREFOX__` → `import.meta.env.FIREFOX` - `__IS_SAFARI__` → `import.meta.env.SAFARI` - `__IS_EDGE__` → `import.meta.env.EDGE` - `__IS_OPERA__` → `import.meta.env.OPERA`	2024-01-29 11:14:18 -06:00
Nenad Novaković	2dcdae91eb	feat(zip)!: add `includeSources` and rename `ignoredSources` to `excludeSources` (#378 ) Co-authored-by: Aaron <aaronklinker1@gmail.com> BREAKING CHANGE: Renamed `ignoredSources` to `excludeSources`	2024-01-29 11:13:39 -06:00
Aaron Klinker	eb758bdeb8	chore: Update contributor docs See https://github.com/wxt-dev/wxt/pull/378\#issuecomment-1915064721	2024-01-29 10:59:54 -06:00
Aaron	5acf51af9d	fix: Generate missing sourcemap in `wxt:unimport` plugin (#381 )	2024-01-29 10:30:42 -06:00
Aaron Klinker	f9718a1b71	docs: Fix typo	2024-01-28 09:42:45 -06:00
GitHub Actions	cf7f23d4c3	chore(release): v0.14.7	2024-01-27 17:31:33 +00:00
Aaron Klinker	62ecb6f41e	fix: Upgrade `web-ext-run` This closes #324	2024-01-27 11:25:49 -06:00
Aaron Klinker	fc45c37f22	docs: Add missing `await` to `createShadowRootUi` examples This closes #374	2024-01-27 11:02:15 -06:00
Aaron Klinker	68874e607e	docs: Document defined constants for the build target	2024-01-27 10:56:14 -06:00
Aaron Klinker	35865adcb2	fix(storage): Throw better error message when importing outside a extension environment This closes #371	2024-01-27 00:26:35 -06:00
Aaron Klinker	3b63a51475	fix: Improve error messages when importing and building entrypoints	2024-01-27 00:20:48 -06:00
東奈比	d32e59e38f	docs: fix incorrect sample code (#372 )	2024-01-26 10:26:10 -06:00
Aaron Klinker	dab8efa140	docs: Add `matches` to content script examples	2024-01-24 07:58:47 -06:00
GitHub Actions	c298d8552b	chore(release): v0.14.6	2024-01-24 06:34:25 +00:00
Aaron	87267347f3	feat: Add basic validation for entrypoint options (#368 )	2024-01-24 00:31:05 -06:00
Aaron	326e84b667	feat: Restart dev mode when saving config (#365 )	2024-01-19 22:58:49 -06:00
Aaron Klinker	4b005b450e	ci: Check for type errors in demo before building	2024-01-19 22:57:06 -06:00
Aaron	3bf40fc4ed	fix: Sort build output files naturally (#364 )	2024-01-19 11:35:09 -06:00
Aaron	9ace395e11	fix: Add subdependency bin directory so `wxt build --analyze` works with PNPM (#363 )	2024-01-19 11:32:18 -06:00
GitHub Actions	64f42064ae	chore(release): v0.14.5	2024-01-19 14:36:07 +00:00
Aaron	a525d786f1	feat: Add `dev.reloadCommand` config (#362 )	2024-01-19 08:33:03 -06:00
Aaron	948ee810da	fix: Disable reload dev command when 4 commands are already registered (#361 )	2024-01-19 07:47:04 -06:00