vite vue3，.env.development文件里，自定义变量 VITE_API_DOMAIN，获取不到，报错 process is not defined？

vite vue3，.env.development文件里，自定义变量，获取不到，报错 process is not defined

调用 process.env.VITE_API_DOMAIN，报错，process is not defined，请问是哪配置不对吗？

# 环境
NODE_ENV = development

# 域名
VITE_API_DOMAIN = http://47.1.1.149:5005

# 接口前缀
VITE_API_BASEPATH = base

# 打包路径
VITE_BASE_PATH = ''

# 标题
VITE_APP_TITLE = test

阅读 1.4k

在 Vite 和 Vue 3 的项目中，环境变量是通过特殊的 .env 文件来管理的，但你不能直接在客户端代码（如 Vue 组件或脚本）中通过 process.env 来访问它们，因为 process 对象在浏览器环境中是不存在的。Vite 在构建过程中会将这些环境变量替换为实际的值，但仅限于特定的前缀（默认为 VITE_）开头的环境变量。

为了在你的 Vue 3 组件或脚本中访问这些环境变量，你应该在 vite.config.js 文件中进行配置，以确保这些环境变量在构建时能被注入到代码中。然而，由于你已经在 .env.development 文件中以 VITE_ 开头定义了你的变量，Vite 应该已经自动处理了它们。

但是，你需要在客户端代码中通过 import.meta.env 来访问这些变量，而不是 process.env。例如：

// 在你的 Vue 组件或脚本中
const apiDomain = import.meta.env.VITE_API_DOMAIN;
const apiBasePath = import.meta.env.VITE_API_BASEPATH;
// ... 其他环境变量

console.log(apiDomain); // 应该输出 "http://47.1.1.149:5005"

如果你确实需要在客户端代码中访问 process.env（尽管在 Vite 中不推荐这样做），你可以使用 @rollup/plugin-replace 或其他类似插件来手动注入这些值，但这通常不是必要的，因为 import.meta.env 提供了更好的方式来访问环境变量。

确保你的 vite.config.js 文件没有配置错误，特别是关于环境变量处理的部分。如果一切正常，但问题仍然存在，请检查你的构建输出或控制台日志，看是否有其他相关的错误或警告信息。

vite vue3，.env.development文件里，自定义变量 VITE_API_DOMAIN，获取不到，报错 process is not defined？

扁平化数组转换成树形?

省市区街道数据在哪里可以下载？

网站的不同域名互相跳转如何保持登录态？

Vue项目一个报错无法找到原因?

Vue3: 响应式 props 解构得到的变量将不是响应式？也不会更新？

前端有没有办法实现页面截图？

一个js输出格式的奇葩需求？