Vite项目中无法从.env文件读取环境变量的问题

Vite不支持Node.js的process.env语法，它有自己的环境变量处理机制，按以下步骤修复：

• 修正.env变量命名规则：Vite要求环境变量必须以VITE_为前缀，修改根目录下的.env文件：

  VITE_RECIPE_API_KEY=你的API密钥
  

• 替换代码中的环境变量调用方式：把process.env换成Vite提供的import.meta.env：

  const api = await axios.get(`https://api.spoonacular.com/recipes/random?apikey=${import.meta.env.VITE_RECIPE_API_KEY}`)
  

• 无需安装dotenv：Vite原生支持环境变量加载，安装dotenv是多余操作，可卸载。

额外注意：

• 修改.env文件后，必须重启Vite开发服务器才能生效
• 生产环境部署时，需在部署平台的环境变量设置中配置对应VITE_RECIPE_API_KEY变量

内容的提问来源于stack exchange，提问作者busayolawumi