首页 > 解决方案 > 为什么我的环境变量在反应中未定义?

问题描述

我想将我的 key 和 base 变量保留在 .env 中,但是当我将它们分配给 .env 和 console.log 时,它的变量是未定义的。

应用文件

# App.js
import './style/App.css';
import Main from './components/Main';
import './style/Search.css'
import { useState } from 'react';
import Error from './components/Error';
import api from './config'

function App() {
  console.log(process.env.REACT_APP_KEY)


  return (
    <div>
       
    </div>
  );
}

export default App;

环境文件

# .env

REACT_APP_KEY=somevalue123
REACT_APP_BASE=somelink

标签: javascriptreactjsenvironment-variables

解决方案


所以我解决这个问题的方法是执行以下操作......

  1. 安装 dotenv 包“npm i dotenv”
  2. 然后你必须导入它并配置它,如下所示

从“dotenv”
dotenv.config() 导入 dotenv;
3.那么你应该能够使用你的环境变量

注意:每次导入新的环境变量时都应该重新启动 npm 服务器


推荐阅读