Как развернуть полнофункциональное приложение к героку или нетлифу? Какие файлы необходимы? - PullRequest
Новая
       78

Как развернуть полнофункциональное приложение к героку или нетлифу? Какие файлы необходимы?

0 голосов
/ 29 февраля 2020

У меня есть полнофункциональное приложение, которое отлично работает на LocalHost, но как только оно развернуто в Интернете (Heroku или netlify), приложение перестает работать должным образом. Мой вопрос заключается в том, какие необходимые изменения необходимо внести, чтобы серверная часть работала правильно и продолжала работать с API для обновления внешнего интерфейса и т. Д. c. Я уже пытался изменить порт на express: 

const PORT = process.env.PORT || 5000;
app.listen(PORT, "0.0.0.0", err => {
  if (err) {
    console.error(err)
  } else {
    console.log(`Running on port ${PORT}`)

}})

Нужно ли добавлять свой собственный файл .env для порта, или это делает heroku? автоматически? Заранее спасибо!

1 Ответ

1 голос
/ 29 февраля 2020

Если вы собираетесь использовать heroku и предполагаете, что вы уже настроили свою учетную запись heroku и уже установили и подключили терминал heroku (если у вас возникли проблемы, сообщите мне)

Тогда вам нужно следующее :

  1. Procfile - этот файл сообщает heroku, какой скрипт использовать для запуска вашего сервера. Убедитесь, что вы называете его Procfile и никаких расширений.

    Он может включать в себя что-то вроде следующего кода

    web: yarn heroku-start - Обратите внимание, здесь я использую yarn в качестве менеджера pacakge, вы может легко заменить его на npm, если это то, что вы используете. Я также звоню heroku-start, который является сценарием, определенным в моем package.json

    Вот пример pacakge.json (я включил только важные строки) 

{
 ...
  "scripts": {
    "dev": "nodemon -w src --exec \"babel-node src --presets env,stage-0\"",
    "build": "babel src -s -D -d dist --presets env,stage-0",
    "start": "pm2 start dist",
    "prestart": "yarn -s build",
    "heroku-prestart": "yarn global add pm2 && pm2 install pm2-logrotate",
    "heroku-start": "node dist",
    "heroku": "yarn -s build && git add . && git commit -m \"Rebuilt dist folder\" && git push heroku mj/bug/memory-leak:master",
    "lint": "eslint src",
    "heroku-postbuild": "echo Skip build on Heroku"
  },
  "devDependencies": {
    "babel-cli": "^6.26.0",
    "babel-core": "^6.26.0",
    "babel-eslint": "^8.0.3",
    "babel-preset-env": "^1.6.1",
    "babel-preset-stage-0": "^6.24.1",
    "eslint": "^4.13.0"
  },
  "eslintConfig": {
    "parserOptions": {
      "ecmaVersion": 9,
      "sourceType": "module"
    },
    "env": {
      "node": true
    },
    "rules": {
      "no-console": 0,
      "no-unused-vars": [
        "warn",
        {
          "argsIgnorePattern": "^_"
        }
      ]
    }
  },
  "heroku-run-build-script": true
}

Я использую babel, чтобы построить свой проект. Пожалуйста, не перегружайтесь количеством моих скриптов, некоторые бесполезны. Однако вам следует обратить внимание на эту строку "heroku-start": "node dist" в разделе «scripts» - это мой скрипт для запуска моего приложения на heroku. Вы можете сказать что-то вроде node index.js Я использую dist, потому что babel собирает мое приложение, чтобы сделать его доступным для более старых версий ecma, при этом позволяя мне использовать новую версию ecma, сценарий build - это то, что генерирует мою папку dist. 1030 *

Я также включил свои devDependences на всякий случай.

Вам также нужно app.json - этот файл в основном описывает ваше приложение для heroku.

Вот пример 

{
  "name":"myApp",
  "description":"my cool app",
  "repository":"https://github.com/mycoolapp/",
  "logo":"http://node-js-sample.herokuapp.com/node.svg",
  "keywords":["node","express","anothertag"],
  "image":"heroku/nodejs"
}

После того, как это будет сделано, вы можете загрузить свой проект к героку и все должно работать нормально. Вы можете установить хук между heroku и вашей мастер-веткой на github, чтобы у вас было автоматическое c развертывание, когда вы добавляете мазер sh в мазер или сливаетесь с ним.

СЛЕДУЮЩИЙ:

У меня есть заметил что-то в вашем коде, я не рекомендовал бы использовать 0.0.0.0 на heroku, вот несколько объяснений, почему https://help.heroku.com/P1AVPANS/why-is-my-node-js-app-crashing-with-an-r10-error

вот ваш новый код 

const PORT = process.env.PORT || 5000;
app.listen(PORT, function(err) {
  if (err) {
    console.error(err)
  } else {
    console.log(`Running on port ${PORT}`)
}
}

Также не используйте функции стрелок, так как некоторые браузеры и heroku могут не собрать его правильно (вот почему я использую babel).

Наконец, это хороший учебник по созданию приложений nodejs на Герою.

https://appdividend.com/2018/04/14/how-to-deploy-nodejs-app-to-heroku/

Удачи.

...