Question

我对部署前端代码完全不熟悉，因而也就是问题。我有一个React应用程序，我需要作为后台进程运行，但是我对如何执行此操作有点困惑。我运行了一个npm脚本

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并在浏览器中打开它，但很自然地，没有任何显示。所以我假设我必须将其作为节点进程运行。如何在生产服务器上执行此操作并将其作为后台进程运行，以便即使我退出终端，应用程序也会继续运行。我查过这个问题， How to make a node.js application run permanently?

但是这有一个javascript文件作为入口点，在我的例子中它是一个html文件。我不确定如何修改我的脚本以永久运行前端应用程序作为后台进程。任何帮助表示赞赏。

Answer 1

您的Javascript文件（distServer.js）是您的入口点 - 它是您启动服务器时运行的文件。您的HTML文件（index.html）仅用作对请求的响应。

babel-node可以用于开发，但它不适合生产。您可以将Javascript文件预编译为vanilla Javascript，然后按照forever中的说明使用pm2或question you already linked to，以便在关闭终端后保持服务器正常运行。

如何组织源文件和编译文件取决于您，但这是一种方法（引自documentation for an example Node server with Babel）：

为生产使用做好准备

所以我们使用babel-node作了一点欺骗。虽然这是   让事情顺利进行。使用它并不是一个好主意   生产

我们应该预先编译你的文件，所以我们现在就这样做。

首先让我们将服务器index.js文件移至lib/index.js。
$ mv index.js lib/index.js
并更新我们的npm start脚本以反映位置变化。
  "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中。

运行React应用程序作为后台进程

1 个答案:

为生产使用做好准备