Запуск приложения React в фоновом режиме

Я совершенно новый для развертывания интерфейсного кода и, следовательно, вопроса. У меня есть приложение React, которое мне нужно запустить как фоновый процесс, однако я немного смущен о том, как это сделать. Я запускаю npm script

npm run build

для создания, минимизации и обслуживания проекта на сервере. Соответствующий код для процесса сборки - это.

"prebuild": "npm-run-all clean-dist test lint build:html",
"build": "babel-node tools/build.js",
"postbuild": "babel-node tools/distServer.js"

Это код внутри distServer.js

import express from 'express';
import path from 'path';
import open from 'open';
import compression from 'compression';


const port = 3000;
const app = express();

app.use(compression());
app.use(express.static('dist'));

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

app.listen(port, function(err){
  if(err){
    console.log(err);
  }else{
    open(`http://localhost:${port}`);
  }
});

Это работает, и проект запускается, однако в момент закрытия моего терминала проект останавливается. Процесс сборки создает три файла,

index.html
index.js
styles.css

Теперь, если я перейду к index.html и открою его в браузере, но, естественно, ничего не появляется. Поэтому я предполагаю, что мне придется запускать его как процесс node. Как это сделать на рабочем сервере и запускать его как фоновый процесс, так что даже если я выйду из терминала, приложение продолжит работу. Я проверил эту проблему, Как сделать приложение node.js работать постоянно?

Но это файл javascript как точка входа, в моем случае это html файл. Я не уверен, как мне изменить свои скрипты, чтобы запустить приложение-интерфейс навсегда как фоновый процесс. Любая помощь была оценена.

Ответ 1

Ваш Javascript файл (distServer.js) - ваша запись - это файл, который вы запускаете для запуска вашего сервера. Ваш HTML файл (index.html) служит только для ответа на запросы.

babel-node подходит для разработки, но не подходит для производства. Вы можете предварительно скомпилировать ваши файлы Javascript в ванильный Javascript, затем используйте forever или pm2, как описано в вопросе который вы уже связали с, чтобы поддерживать работу сервера даже после закрытия вашего терминала.

Как вы упорядочиваете исходные файлы и скомпилированные файлы, зависит от вас, но здесь один из способов сделать это (цитата из документация для примера Node сервер с Babel):

Подготовка к использованию

Итак, мы немного обманули, используя babel-node. Хотя это отлично подходит для получения чего-то. Не рекомендуется использовать его в производство.

Мы должны предварительно скомпилировать ваши файлы, поэтому сделаем это сейчас.

Сначала переместите наш сервер index.js на lib/index.js.

$ mv index.js lib/index.js

И обновите наш npm start script, чтобы отразить изменение местоположения.

  "scripts": {
-   "start": "nodemon index.js --exec babel-node --presets es2015,stage-2"
+   "start": "nodemon lib/index.js --exec babel-node --presets es2015,stage-2"
  }

Далее добавьте две новые задачи npm run build и npm run serve.

  "scripts": {
    "start": "nodemon lib/index.js --exec babel-node --presets es2015,stage-2",
+   "build": "babel lib -d dist --presets es2015,stage-2",
+   "serve": "node dist/index.js"
  }

Теперь мы можем использовать npm run build для предварительной компиляции наших активов и npm run serve для запуска нашего сервера в процессе производства.

$ npm run build
$ npm run serve

Это означает, что мы можем быстро перезагрузить наш сервер, не дожидаясь babel для перекомпилирования наших файлов.

О, не забудьте добавить dist в наш .gitignore файл.

$ touch .gitignore

dist

Это позволит убедиться, что мы случайно не передаем наши встроенные файлы git.