Разверните приложение Nodejs + Express + React + Webpack на Heroku - PullRequest
0 голосов
/ 06 ноября 2018

Я сделал веб-приложение, используя узел js, express, webpack, реагировать и сокет io, и я хотел бы развернуть его на heroku. Когда я пытаюсь это сделать, я могу получить доступ к сайту, но он показывает мне сообщение об ошибке:

Не удается получить /

Вот моя конфигурация:

    "scripts": {
    "start": "npm run dev",
    "build": "webpack --mode production",
    "client": "webpack-dev-server --mode development --devtool inline-source-map --hot",
    "server": "nodemon src/server/index.js",
    "dev": "concurrently \"npm run server\" \"npm run client\"",
    "heroku-postbuild": "NPM_CONFIG_PRODUCTION=false npm install && npm run build"
  }

Сценарий запуска был node src/server/index.js, прежде чем я изменил его, потому что я запускаю npm run dev, чтобы запустить мое приложение локально.

Вот мой репозиторий: http://git.kamal -allali.fr / kamal / prog_web_5a

Вот ссылка на геройку: https://fast -earth-60949.herokuapp.com

Вот логи герою:

2018-11-05T21: 42: 44.984679 + 00: 00 приложение [web.1]: 1 Построено в: 05.11.2008 21:42:44

2018-11-05T21: 42: 44.984681 + 00: 00 приложение [web.1]: 1 Актив
Имена кусков размера

2018-11-05T21: 42: 44.984683 + 00: 00 app [web.1]: 1 bundle.js 7.42 MiB main [испущенный] main

2018-11-05T21: 42: 44.984685 + 00: 00 app [web.1]: 1 favicon.ico 40.4 КиБ [испущено]

2018-11-05T21: 42: 44,984686 + 00: 00 приложение [web.1]: 1 index.html 717 байт [испущено]

2018-11-05T21: 42: 44.984688 + 00: 00 приложение [web.1]: 1 Entrypoint main = bundle.js

2018-11-05T21: 42: 44,984710 + приложение 00:00 [web.1]: 1 [./node_modules/loglevel/lib/loglevel.js] 7,68 КиБ {основной} [встроенный]

2018-11-05T21: 42: 44,984712 + 00:00 приложение [web.1]: 1 [./node_modules/react-dom/index.js] 1,33 КиБ {основной} [встроенный]

2018-11-05T21: 42: 44.984713 + 00:00 приложение [web.1]: 1 [./node_modules/react/index.js] 190 байт {основной} [встроенный] 2018-11-05T21: 42: 44,984715 + 00:00 приложение [web.1]: 1 [./node_modules/url/url.js] 22,8 КиБ {основной} [встроенный]

2018-11-05T21: 42: 44,984718 + 00:00 приложение [web.1]: 1 [./node_modules/webpack-dev-server/client/index.js?http://localhost:3000] (webpack) -dev-сервер / клиент? http://localhost:3000 7,78 КиБ {main} [Встроенный]

2018-11-05T21: 42: 44,984720 + приложение 00:00 [web.1]: 1 [./Node_modules/webpack-dev-server/client/overlay.js] (webpack) -dev-server / client / overlay.js 3,58 КБ {основной} [встроенный]

2018-11-05T21: 42: 44.984723 + 00: 00 app [web.1]: 1 [0] multi (WebPack) -dev-сервер / клиент http://localhost:3000 (веб-пакет) /hot/dev-server.js ./src/client/index.js 52 байта {основной} [Встроенный]

2018-11-05T21: 42: 44,984724 + 00:00 приложение [web.1]: 1 [./Node_modules/webpack-dev-server/client/socket.js] (webpack) -dev-server / client / socket.js 1,05 КиБ {основной} [встроенный]

2018-11-05T21: 42: 44,984726 + 00:00 приложение [web.1]: 1 [./Node_modules/webpack-dev-server/node_modules/strip-ansi/index.js] (webpack) -dev-server / node_modules / strip-ansi / index.js 161 байт {основной} [Встроенный]

2018-11-05T21: 42: 44,984728 + приложение 00:00 [web.1]: 1 [./node_modules/webpack/hot sync ^. / log $] (веб-пакет) / горячая синхронизация нерекурсивный ^. / log $ 170 байт {main} [встроенный]

2018-11-05T21: 42: 44,984730 + приложение 00:00 [web.1]: 1 [./node_modules/webpack/hot/dev-server.js] (веб-пакет) /hot/dev-server.js 1,61 КиБ {основной} [встроенный]

2018-11-05T21: 42: 44,984732 + приложение 00:00 [web.1]: 1 [./node_modules/webpack/hot/emitter.js] (веб-пакет) /hot/emitter.js 75 bytes {main} [встроенный]

2018-11-05T21: 42: 44,984733 + 00:00 приложение [web.1]: 1 [./Node_modules/webpack/hot/log-apply-result.js] (webpack) /hot/log-apply-result.js 1,27 КиБ {основной} [встроенный]

2018-11-05T21: 42: 44,984735 + приложение 00:00 [web.1]: 1 [./src/client/Layout.js] 4.33 КиБ {основной} [встроенный]

2018-11-05T21: 42: 44,984736 + приложение 00:00 [web.1]: 1 [./src/client/index.js] 205 байт {основной} [встроенный]

2018-11-05T21: 42: 44.984738 + 00:00 приложение [web.1]: 1 + 349 скрыто модули

2018-11-05T21: 42: 44,984740 + приложение 00:00 [web.1]: 1 Ребенок html-webpack-plugin для "index.html":

2018-11-05T21: 42: 44.984742 + 00: 00 app [web.1]: 1 1 актив

2018-11-05T21: 42: 44.984743 + 00: 00 приложение [web.1]: 1 Точка входа undefined = index.html

2018-11-05T21: 42: 44,984745 + 00:00 приложение [web.1]: 1
[./Node_modules/html-webpack-plugin/lib/loader.js!./public/index.html] 828 байт {0} [встроенный]

2018-11-05T21: 42: 44,984746 + 00:00 приложение [web.1]: 1
[./node_modules/lodash/lodash.js] 527 КиБ {0} [встроенный] 2018-11-05T21: 42: 44.984748 + 00:00 приложение [web.1]: 1
[./node_modules/webpack/buildin/global.js] (веб-пакет) /buildin/global.js 489 байт {0} [встроенный]

2018-11-05T21: 42: 44.984749 + 00: 00 app [web.1]: 1
[./node_modules/webpack/buildin/module.js] (веб-пакет) /buildin/module.js 497 байт {0} [встроенный]

2018-11-05T21: 42: 44.984751 + 00: 00 приложение [web.1]: 1 ℹ 「wdm」: скомпилировано успешно.

2018-11-05T22: 16: 20.551630 + 00:00 heroku [web.1]: холостой ход

2018-11-05T22: 16: 20.552092 + 00:00 heroku [web.1]: состояние изменилось с вниз

2018-11-05T22: 16: 21.411951 + 00: 00 heroku [web.1]: остановка всех процессов с SIGTERM

2018-11-05T22: 16: 21.808625 + 00:00 heroku [web.1]: процесс завершен с статус 143

2018-11-06T08: 35: 42.000000 + 00: 00 приложение [api]: сборка запущена пользователем kamal.allali@outlook.fr

2018-11-06T08: 36: 36.888512 + 00: 00 heroku [web.1]: состояние изменено с до начала

2018-11-06T08: 36: 36.713630 + 00: 00 app [api]: развертывание d62783d3 пользователем kamal.allali@outlook.fr

2018-11-06T08: 36: 36.713630 + 00: 00 app [api]: Выпуск v12, созданный пользователем kamal.allali@outlook.fr

2018-11-06T08: 36: 40.000000 + 00: 00 приложение [api]: сборка завершена

2018-11-06T08: 36: 42.010068 + 00:00 heroku [web.1]: запуск процесса с команда npm start

2018-11-06T08: 36: 45.324322 + 00:00 приложение [web.1]:

2018-11-06T08: 36: 45.324353 + 00: 00 app [web.1]:> projet-web-5a@1.0.0 начало / приложение

2018-11-06T08: 36: 45.324355 + 00: 00 app [web.1]:> npm run dev

2018-11-06T08: 36: 45.324356 + 00:00 приложение [web.1]:

2018-11-06T08: 36: 45.753063 + 00:00 приложение [web.1]:

2018-11-06T08: 36: 45.753112 + 00: 00 app [web.1]:> projet-web-5a@1.0.0 dev / Приложение

2018-11-06T08: 36: 45.753114 + 00: 00 app [web.1]:> одновременно «npm run» сервер "" клиент запуска npm "

2018-11-06T08: 36: 45.753116 + 00: 00 app [web.1]:

2018-11-06T08: 36: 47.147860 + 00:00 приложение [web.1]: 1

2018-11-06T08: 36: 47.147877 + 00:00 приложение [web.1]: 1 > projet-web-5a@1.0.0 клиент / приложение

2018-11-06T08: 36: 47.147879 + 00: 00 app [web.1]: 1 > webpack-dev-server --mode development --devtool inline-source-map --hot

2018-11-06T08: 36: 47.147881 + 00:00 приложение [web.1]: 1

2018-11-06T08: 36: 47.172481 + приложение 00:00 [web.1]: [0]

2018-11-06T08: 36: 47.172485 + 00: 00 app [web.1]: [0]> projet-web-5a@1.0.0 сервер / приложение

2018-11-06T08: 36: 47.172487 + 00: 00 app [web.1]: [0]> nodemon ЦСИ / сервер / index.js

2018-11-06T08: 36: 47.172488 + 00:00 приложение [web.1]: [0]

2018-11-06T08: 36: 47.672353 + 00: 00 app [web.1]: [0] [nodemon] 1.18.4

2018-11-06T08: 36: 47.673281 + 00: 00 приложение [web.1]: [0] [nodemon] для перезапуска в любое время введите rs

2018-11-06T08: 36: 47.673747 + 00: 00 приложение [web.1]: [0] [nodemon]: / Приложение / SRC / сервер / ** / ** * 1220

2018-11-06T08: 36: 47.674424 + 00: 00 приложение [web.1]: [0] [nodemon] запускается node src/server/index.js

2018-11-06T08: 36: 47.963706 + 00: 00 app [web.1]: [0] Прослушивание через порт 45437

2018-11-06T08: 36: 48.299567 + 00:00 heroku [web.1]: состояние изменено с начиная до 1227 *

2018-11-06T08: 36: 48.679674 + 00: 00 app [web.1]: 1 clean-webpack-plugin: / app / dist был удален.

2018-11-06T08: 36: 48.905698 + приложение 00: 00 [web.1]: 1 ℹ 「wds」: проект завершен работает на http://localhost:3000/

2018-11-06T08: 36: 48.906031 + 00: 00 app [web.1]: 1 ℹ 「wds」: webpack выход подается с /

2018-11-06T08: 36: 48.956210 + 00: 00 приложение [web.1]: 1 ⚠ 「wds」: невозможно открыть браузер Если вы работаете в безголовой среде, пожалуйста, сделайте не использовать флаг --open

2018-11-06T08: 36: 55.276089 + 00:00 геройка [роутер]: at = метод информации = GET путь = "/" хост = fast-earth-60949.herokuapp.com request_id = 2474b83b-65ce-43b4-a54f-6851d5f55a7c fwd = "78.112.168.129" dyno = web.1 connect = служба 0 мс = состояние 9 мс = 404 байта = протокол 360 = https

2018-11-06T08: 36: 57.303048 + 00: 00 приложение [web.1]: 1 ℹ 「wdm」: Хеш: 6de9947fac0c16b70883

2018-11-06T08: 36: 57.303058 + приложение 00:00 [web.1]: 1 Версия: webpack 4.19.1

2018-11-06T08: 36: 57.303061 + приложение 00:00 [web.1]: 1 Время: 8512 мс

2018-11-06T08: 36: 57.303063 + 00:00 приложение [web.1]: 1 Построено в: 11.06.2008 8:36:57

2018-11-06T08: 36: 57.303066 + приложение 00:00 [web.1]: 1 Актив
Имена кусков размера

2018-11-06T08: 36: 57.303069 + приложение 00:00 [web.1]: 1 bundle.js 7.42 MiB main [испущенный] main

2018-11-06T08: 36: 57.303071 + приложение 00:00 [web.1]: 1 favicon.ico 40,4 КиБ [испущено]

2018-11-06T08: 36: 57.303073 + 00:00 приложение [web.1]: 1 index.html 717 байт [испущено]

2018-11-06T08: 36: 57.303074 + 00: 00 app [web.1]: 1 Entrypoint main = bundle.js

2018-11-06T08: 36: 57.303077 + приложение 00:00 [web.1]: 1 [./node_modules/loglevel/lib/loglevel.js] 7,68 КиБ {основной} [встроенный]

2018-11-06T08: 36: 57.303078 + 00:00 приложение [web.1]: 1 [./node_modules/react-dom/index.js] 1,33 КиБ {основной} [встроенный]

2018-11-06T08: 36: 57.303080 + 00:00 приложение [web.1]: 1 [./node_modules/react/index.js] 190 байт {основной} [встроенный] 2018-11-06T08: 36: 57.303082 + приложение 00:00 [web.1]: 1 [./node_modules/url/url.js] 22,8 КиБ {основной} [встроенный]

2018-11-06T08: 36: 57.303084 + приложение 00:00 [web.1]: 1 [./node_modules/webpack-dev-server/client/index.js?http://localhost:3000] (webpack) -dev-сервер / клиент? http://localhost:3000 7,78 КиБ {main} [Встроенный]

2018-11-06T08: 36: 57.303087 + приложение 00:00 [web.1]: 1 [./Node_modules/webpack-dev-server/client/overlay.js] (webpack) -dev-server / client / overlay.js 3,58 КБ {основной} [встроенный]

2018-11-06T08: 36: 57.303090 + 00:00 приложение [web.1]: 1 [0] мульти (WebPack) -dev-сервер / клиент http://localhost:3000 (веб-пакет) /hot/dev-server.js ./src/client/index.js 52 байта {основной} [Встроенный]

2018-11-06T08: 36: 57.303091 + приложение 00:00 [web.1]: 1 [./Node_modules/webpack-dev-server/client/socket.js] (webpack) -dev-server / client / socket.js 1,05 КиБ {основной} [встроенный]

2018-11-06T08: 36: 57.303093 + 00:00 приложение [web.1]: 1 [./Node_modules/webpack-dev-server/node_modules/strip-ansi/index.js] (webpack) -dev-server / node_modules / strip-ansi / index.js 161 байт {основной} [Встроенный]

2018-11-06T08: 36: 57.303095 + 00:00 приложение [web.1]: 1 [./node_modules/webpack/hot sync ^. / log $] (веб-пакет) / горячая синхронизация нерекурсивный ^. / log $ 170 байт {main} [встроенный]

2018-11-06T08: 36: 57.303099 + 00:00 приложение [web.1]: 1 [./node_modules/webpack/hot/dev-server.js] (веб-пакет) /hot/dev-server.js 1,61 КиБ {основной} [встроенный]

2018-11-06T08: 36: 57.303100 + приложение 00:00 [web.1]: 1 [./node_modules/webpack / hot / emitter.js] (веб-пакет) /hot/emitter.js 75 bytes {main} [встроенный]

2018-11-06T08: 36: 57.303102 + 00: 00 app [web.1]: 1 [./Node_modules/webpack/hot/log-apply-result.js] (webpack) /hot/log-apply-result.js 1.27 КиБ {main} [встроенный]

2018-11-06T08: 36: 57.303104 + 00: 00 app [web.1]: 1 [./src/client/Layout.js] 4.33 КиБ {основной} [встроенный]

2018-11-06T08: 36: 57.303106 + 00: 00 приложение [web.1]: 1 [./src/client/index.js] 205 байт {основной} [встроенный]

2018-11-06T08: 36: 57.303108 + 00: 00 приложение [web.1]: 1 + 349 скрыто модули

2018-11-06T08: 36: 57.303109 + 00: 00 app [web.1]: 1 Child html-webpack-plugin для "index.html":

2018-11-06T08: 36: 57.303111 + 00: 00 app [web.1]: 1 1 актив

2018-11-06T08: 36: 57.303113 + 00: 00 приложение [web.1]: 1 Точка входа undefined = index.html

2018-11-06T08: 36: 57.303115 + 00: 00 приложение [web.1]: 1
[./Node_modules/html-webpack-plugin/lib/loader.js!./public/index.html] 828 байт {0} [встроенный]

2018-11-06T08: 36: 57.303116 + 00: 00 приложение [web.1]: 1
[./node_modules/lodash/lodash.js] 527 КиБ {0} [встроенный] 2018-11-06T08: 36: 57.303118 + 00: 00 приложение [web.1]: 1
[./node_modules/webpack/buildin/global.js] (веб-пакет) /buildin/global.js 489 байт {0} [встроенный]

2018-11-06T08: 36: 57.303119 + 00: 00 приложение [web.1]: 1
[./node_modules/webpack/buildin/module.js] (веб-пакет) /buildin/module.js 497 байт {0} [встроенный]

2018-11-06T08: 36: 57.303457 + 00:00 приложение [web.1]: 1 ℹ 「wdm」: скомпилировано успешно.

Ответы [ 2 ]

0 голосов
/ 06 ноября 2018

Без журналов Heroku, это своего рода спекуляция ... НО

Cannot GET / - означает, что экспресс не отвечает по пути.

Heroku обслуживает NodeJ, используя экспресс, и там должна быть ошибка

После проверки кода на сервере / index.js вы используете пакет path и забыли импортировать его:)

const path = require('path');

Как только вы исправите это, вам также нужно будет добавить условие для доступа к папке DIST, а не к общедоступной (как вы будете обслуживать папку DIST)

if (process.env.NODE_ENV === 'production') {
    app.use(express.static(path.join(__dirname, 'build')));
    app.get('*', function (req, res) {
        res.sendFile(path.join(__dirname, 'build', 'index.html'));
    });
}

* Также проверьте, что dist загружается и не включен .gitignore

Удачи!

0 голосов
/ 06 ноября 2018

Вам необходимо добавить версию своего узла в package.json.

Пример:

  "engines": {
    "node": "10.11.0"
  }

Я ответил в комментариях, но это не лучший способ, поэтому я буду редактировать здесь.

Поскольку вы пытаетесь обслуживать статический контент, попробуйте использовать статическое промежуточное ПО.

Удалить

app.get('*', (req,res) =>{
    res.sendFile(path.join(__dirname,'../../public/index.html'));
});

И добавить

app.use(express.static(path.join(__dirname,'../../public')));

Второе редактирование.

Вам нужно собрать свой проект и обслуживать папку, обычно это папка dist или build.

Для этого у вас есть несколько вариантов, один из которых - создать проект перед публикацией ваших изменений в heroku, но это может стать немного утомительным.

Другой вариант - сделать скрипт postinstall, чтобы после того, как heroku выполнила npm, установился проект и была создана папка dist или build с последними изменениями.

"postinstall": "npm run build"

Если вы не хотите, чтобы скрипт запускался каждый раз при установке npm, вы можете использовать if-env с переменной окружения в heroku.

"postinstall": "if-env NODE_ENV=production && npm run build"

Как только вы узнаете, какая папка создается при сборке, измените следующую строку.

app.use(express.static(path.join(__dirname,'path to the folder with the prod build')));
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...