React项目中，如何定义全局变量？

Question

React项目中，如何定义全局变量？

我的想法是，在src/constants/创建一个文件专门定义全局变量：

但是我在组件使用的时候却报错：
window.env是undefined.

Answer 1

在 React 中定义全局变量，可以通过在 src/ 目录下新建一个 env.js 文件，并在里面定义要使用的全局变量，例如：

// src/env.js
const env = {
  apiUrl: 'http://localhost:3000',
  debug: true
};

export default env;

然后在需要使用全局变量的文件中，通过 import 引入 env.js 文件，并从中获取全局变量，例如：

import env from './env.js';

console.log(env.apiUrl); // 'http://localhost:3000'

在生产环境中，需要使用 HTTPS 协议时，可以通过在 env.js 文件中判断当前环境，从而设置不同的参数，例如：

// src/env.js
const env = {
  apiUrl: process.env.NODE_ENV === 'production' ? 'https://api.example.com' : 'http://localhost:3000',
  debug: false
};

export default env;

这样就可以根据当前环境来设置不同的全局变量了。