Reactjs React js中的环境变量

在我的项目中有一个环境变量作为

process.env.GOOGLE_MAPS_API

其中包含一个google api密钥，并使用该密钥渲染地图，但以下代码不起作用：

export default GoogleApiWrapper({
  apiKey: (process.env.GOOGLE_MAPS_API)
})(MapContainer)

但当我直接使用api键时，它正在渲染贴图

export default GoogleApiWrapper({
      apiKey: ('AI************************')
 })(MapContainer)

---

如何在上述代码中使用google api键作为环境变量？

如果您使用Webpack捆绑代码，则 示例代码-

// webpack.config.js
    new webpack.DefinePlugin({
  GOOGLE_MAPS_API: JSON.stringify(process.env.GOOGLE_MAPS_API)
})

app.js

console.log(GOOGLE_MAPS_API); // logs API_KEY

---

如果您使用Webpack捆绑代码，则 示例代码-

// webpack.config.js
    new webpack.DefinePlugin({
  GOOGLE_MAPS_API: JSON.stringify(process.env.GOOGLE_MAPS_API)
})

app.js

console.log(GOOGLE_MAPS_API); // logs API_KEY