为什么在.env中定义的变量没有生效?

Question

为什么在.env中定义的变量没有生效?

peterhuan

6812963

发布于
2 月 3 日山东

复现

.env
```
VITE_TEST=sss
```

src/examples/Env.vue

<script setup>
console.log(import.meta.env.MODE);
console.log(import.meta.env.BASE_URL);
console.log(import.meta.env.VITE_TEST);
</script>
<template>
<p>变量测试</p>
</template>
<style scoped></style>

package.json

{
"name": "vite-vue-starter",
"private": true,
"version": "0.0.0",
"type": "module",
"scripts": {
  "dev": "vite",
  "build": "vite build",
  "preview": "vite preview"
},
"dependencies": {
  "echarts": "^5.6.0",
  "element-plus": "^2.9.3",
  "vue": "^3.5.13"
},
"devDependencies": {
  "@vitejs/plugin-vue": "^5.2.1",
  "unplugin-auto-import": "^19.0.0",
  "unplugin-vue-components": "^28.0.0",
  "vite": "^6.0.11"
}
}

获取到的import.meta.env.VITE_TEST的值为undefined

vite vue3

阅读 2k

AI BotBETA

### 回答

在 `.env` 文件中定义的变量没有生效，通常是因为变量名没有以 `VITE_` 为前缀。Vite 项目中，只有以 `VITE_` 开头的环境变量才会被暴露到 `import.meta.env` 中。

在你的例子中，`.env` 文件定义了 `VITE_TEST=sss`，这个变量应该是可以正确读取的。但如果 `import.meta.env.VITE_TEST` 的值为 `undefined`，可能的原因包括：

1. **确保 `.env` 文件位置正确**：`.env` 文件应该位于项目的根目录。
2. **确保 Vite 正确加载了 `.env` 文件**：有时由于配置问题或插件干扰，Vite 可能没有正确加载 `.env` 文件。
3. **检查 Vite 版本**：确保你使用的 Vite 版本支持从 `.env` 文件中读取变量。
4. **重启开发服务器**：有时在修改 `.env` 文件后，需要重启 Vite 开发服务器才能使更改生效。

根据你的代码和配置，`VITE_TEST` 应该是可以被正确读取的。如果问题仍然存在，尝试上述步骤进行排查。

1 个回答

得票最新

Meathill

22.5k133642

发布于
2 月 3 日广东

✓ 已被采纳

.env 的位置不对，放到根路径去。

撰写回答