Как развернуть приложение реакции, использующее API-сервер?

Question

У меня есть frontend-приложение, написанное с использованием React, которое использует api-сервер 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. ш "

Answer 1

Create-реакции-приложение позволяет использовать переменные среды. Вы можете найти больше информации, определенной здесь: 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, поэтому прокси не будет применяться. Вам необходимо определить переменную среды, как показано в документации, и при сборке она будет применять значение переменной среды к вашему приложению.

Answer 2

Вы собираетесь использовать npm run build для создания статического файла, а затем вы можете разместить его на любом статическом файловом сервере, который вам нужен (например, Node / Express). Однако все становится сложнее, если вы используете React-Router.

Вот ссылка на полное руководство по этому вопросу: Инструкции по развертыванию

Это очень тщательно и должно ответить на все ваши вопросы.