React项目中.env文件环境变量读取返回undefined问题

• 检查.env文件的位置与命名
  必须将.env文件放在项目根目录（和package.json同级），不能放在src或其他子文件夹下；文件名严格为.env，开发环境可使用.env.development、生产环境用.env.production，但只有以REACT_APP_开头的变量会被Create React App打包识别。

• 移除变量定义中的空格
  你的.env文件里REACT_APP_SOCKET_URL = ws://localhost:2900的写法有问题，等号前后不能有空格，正确格式为：

  REACT_APP_SOCKET_URL=ws://localhost:2900
  

• 重启开发服务器
  React环境变量仅在开发服务器启动时加载，修改.env文件后必须重启npm start或yarn start，否则新变量不会生效。

• 确认变量前缀与大小写
  自定义环境变量必须以REACT_APP_开头，且变量名区分大小写，确保代码中访问的变量名和.env里完全一致。

验证示例：
修改.env后重启服务器，在组件中访问：

useEffect(() => {
  console.log(process.env.REACT_APP_SOCKET_URL); // 正常输出ws://localhost:2900
}, []);

内容的提问来源于stack exchange，提问作者Captai-N