时间戳

首页 > 解决方案 > 如何部署使用 API-server 的 react 应用程序？

reactjs - 如何部署使用 API-server 的 react 应用程序？

问题描述

我有前端应用程序，使用 React 编写，它使用 api-server https://koalerplate-xxxxxxx.now.sh “。

//package.json

{
     ...
      "dependencies": {
        "bulma": "^0.7.1",
        "react": "^16.4.1",
        "react-dom": "^16.4.1",
        "react-redux": "^5.0.7",
        "react-scripts": "1.1.4",
        "redux": "^4.0.0",
        "redux-saga": "^0.16.0"
      },
      "scripts": {
        "start": "react-scripts start",
      },
      "proxy": "https://koalerplate-xxxxxxx.now.sh"
    }

“npm start”，然后在浏览器中打开“localhost:3000”，一切正常。如何部署此应用程序？我必须如何申请“代理”：“ https://koalerplate-xxxxxxx.now.sh ”？我尝试使用 webpack 构建，得到 index.html + bundle.js，并将这 2 个文件上传到静态服务器，但不工作.. 在文件 bundle.js 中我找不到这个代理“koalerplate-xxxxxxx.now。嘘"

标签： reactjsdeploymentfrontend

解决方案

Create-react-app 允许您使用环境变量。您可以在此处找到更多信息：https ://github.com/facebook/create-react-app/blob/master/packages/react-scripts/template/README.md#adding-custom-environment-variables

当您运行npm run build它时，它会生成静态 html/css/js 文件并且不再使用 package.json，因此代理将不适用。您需要像文档显示的那样定义一个环境变量，并且当您进行构建时，它会将环境变量的值应用于您的应用程序。

推荐阅读