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

У меня есть 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. ш"

2 ответа

Решение

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

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

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

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

Другие вопросы по тегам