反应样板 - 在运行时更改 API url答案

【问题标题】：React boilerplate - changing API url at runtime反应样板 - 在运行时更改 API url
【发布时间】：2018-07-02 23:09:23
【问题描述】：

我使用 react-boilerplate 作为我项目的基础。

我目前在 webpack.base.babel.js 中定义我的 API url，如下所示：

new webpack.DefinePlugin({
      'process.env': {
        NODE_ENV: JSON.stringify(process.env.NODE_ENV),
        PIZZA_API_URL: JSON.stringify('https://some-ip:8081')
      },
    }),

但是，这仅在构建时获取。

在 create-react-app 中，您可以使用 REACT_APP_PIZZA_URL。任何以 REACT_APP* 开头的东西都可以在运行时开始设置。

所以我可以这样做：

docker run -e "REACT_APP_DB_HOST=HELLOWORLD" -d -p3000:3000 pizza-supplier-ui:test

你如何用 react-boilerplate 做同样的事情？

谢谢

【问题讨论】：

放到js文件里？
如果您需要在运行时更改它，为什么还要在构建时进行设置？ ??????
在为 react 应用构建 docker 镜像时，您可以指定 -e "variable_goes_here" 并且 API URLS 将被更新。能够在运行时更改它也有一些好处。

标签： node.js reactjs webpack create-react-app react-boilerplate

【解决方案1】：

好的 - 经过数小时的研究和反复试验，这是我自己的问题的答案。

对于生产构建，webpack 将编译你的 js 文件并将它们捆绑在 build/ 目录中。

引用为 ${process.env.API_URL}/api/query/findPizzaById/ 的 API URL 被烘焙到 build/ 目录中的已编译 js 文件中。

因此这个命令：

docker run -e "API_URL=HELLOWORLD" -d -p3000:3000 pizza-supplier-ui:test

完全没有效果。但是，它确实将 API_URL 注册为正在运行的 docker 映像上的环境变量。这里的问题是 API_URL 是在 BUILD TIME 定义的，使用构建运行的环境变量 FROM。

如果有人遇到过这个问题并有解决方案，我将不胜感激！

谢谢

【讨论】：