环境变量

.env 文件

WXT 支持与 Vite 相同的方式使用 .env 文件（Vite 文档）。创建以下任意一个文件：

.env
.env.local
.env.[mode]
.env.[mode].local
.env.[browser]
.env.[browser].local
.env.[mode].[browser]
.env.[mode].[browser].local

这些文件中的任何环境变量在运行时都会可用：

# .env
WXT_API_KEY=...

await fetch(`/some-api?apiKey=${import.meta.env.WXT_API_KEY}`);

请确保将任何环境变量前缀为 WXT_ 或 VITE_，否则它们在运行时不可用（Vite 的约定）。

预定义的环境变量

WXT 提供基于当前命令的一些自定义环境变量：

使用场景	类型	描述
import.meta.env.MANIFEST_VERSION	2 │ 3	目标 manifest 版本
import.meta.env.BROWSER	string	目标浏览器
import.meta.env.CHROME	boolean	等同于 import.meta.env.BROWSER === "chrome"
import.meta.env.FIREFOX	boolean	等同于 import.meta.env.BROWSER === "firefox"
import.meta.env.SAFARI	boolean	等同于 import.meta.env.BROWSER === "safari"
import.meta.env.EDGE	boolean	等同于 import.meta.env.BROWSER === "edge"
import.meta.env.OPERA	boolean	等同于 import.meta.env.BROWSER === "opera"

此外，您还可以访问 Vite 的所有环境变量（Vite 文档）：

使用场景	类型	描述
import.meta.env.MODE	string	模式 的扩展程序正在运行的类型
import.meta.env.PROD	boolean	当 NODE_ENV='production' 时真
import.meta.env.DEV	boolean	import.meta.env.PROD 为假的反义词

其他 Vite 环境变量

Vite 提供两个其他环境变量，但它们在 WXT 项目中没有用处：

• import.meta.env.BASE_URL：使用 browser.runtime.getURL 替代。
• import.meta.env.SSR：始终为假。

宣传单

要在 manifest 中使用环境变量，需要使用函数式语法：

export default defineConfig({
  extensionApi: 'chrome',
  modules: ['@wxt-dev/module-vue'],
  manifest: { 
    oauth2: { 
      client_id: import.meta.env.WXT_APP_CLIENT_ID
    } 
  } 
  manifest: () => ({ 
    oauth2: { 
      client_id: import.meta.env.WXT_APP_CLIENT_ID
    } 
  }), 
});

WXT 只能在配置文件加载 .env 文件之后才能加载 .env 文件。因此，使用 manifest 的函数式语法会延迟创建对象直到 .env 文件已加载到过程中。