使用MERN架构为NodeJS项目创建可执行文件

时间:2019-04-23 08:33:38

标签: node.js reactjs express mern zeit-pkg

** 请参见下面的编辑 **

我创建了一个简单的MERN(Mongo,Express,React,NodeJS)应用程序来构成项目的基础。我正在探索在应用程序完成后创建用于部署的可执行文件的可能方法。应该为多种操作系统和体系结构创建可执行文件。

该应用程序符合一个NodeJS后端,该后端运行一个Express Web服务器,该服务器可以访问MongoDB实例(实际上是NeDB,但为简单起见,我将其称为Mongo),并且前端由React创建。

我尝试使用PKG,并简要介绍了nexe,看起来这两个工具都应该为我提供解决方案。

但是,由于我项目的文件结构,我遇到了一些问题。我的应用程序的文件夹结构如下:

/
/server
....<express files>
....package.json
/client
....<react files>
....package.json
package.json

此文件夹结构的原因是允许我的应用程序通过从根目录运行npm start来运行服务器和客户端应用程序。这是通过使用根文件夹的package.json文件来完成的,该文件具有以下内容:

{
  "name": "MyApplication",
  "version": "1.0.0",
  "description": "",
  "main": "index.js",
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1",
    "client": "cd client && npm start",
    "server": "cd server && npm start",
    "start": "concurrently \"npm run server\" \"npm run client\" --kill-others"
  },
  "keywords": [],
  "author": "",
  "license": "ISC",
  "devDependencies": {
    "concurrently": "3.5.1"
  },
  "pkg": {
    "assets": [
      "client/*",
      "server/*"
    ]
  }
}

基本上,我试图创建一个可执行文件来模仿我在根目录上运行npm start时的行为。可执行文件应在server目录中启动后端服务,还应在client目录中执行React代码。

如您所见,我试图向pkg添加一些参数,但这似乎不起作用。

有没有一种方法可以配置PKG或任何其他类似的工具来产生我想要的东西?还是我必须为服务器和客户端都有一个单独的可执行文件?理想情况下,我只想要一个文件。

谢谢。

** 编辑 **

我遇到了以下样板应用程序,这些应用程序基本上可以实现我所寻找的目标:https://github.com/crsandeep/simple-react-full-stack

但是,我正在努力使其与PKG一起使用。我已经能够成功生成一个.exe文件,但是不幸的是,当我在浏览器中加载根页面(localhost:8080)时,它会显示错误消息Cannot GET /,但是示例API调用可以正常工作。

我猜想这是由于我的package.json文件中缺少某些内容,但是我似乎无法解决。无需使用PKG运行应用程序就可以正常工作。

以下是我为package.json文件添加的内容:

"pkg": {
    "scripts": "./dist/bundle.js",
    "assets": [
      "./dist/index.html",
      "./dist/favicon.ico"
    ]
  },
  "bin": "src/server/index.js"

然后使用以下语句(与package.json在同一目录中)运行PKG

pkg . --target node10-win-x64 --out-dir ../

我在package.json中尝试了许多不同的项目组合,但似乎无法正确完成。

有人对此有解决方案吗?

1 个答案:

答案 0 :(得分:0)

我设法做到了,因此现在可以使用PKG将从https://github.com/crsandeep/simple-react-full-stack获得的样板代码生成为可执行文件。

我几乎可以在我对问题的编辑中使用它了,但这是完整的解决方案:

确保package.json包含以下内容:

"pkg": {
  "scripts": "./dist/bundle.js",
  "assets": [
    "./dist/index.html",
    "./dist/favicon.ico"
  ]
},
"bin": "src/server/index.js"

然后,在src/server/index.js文件中,更改以下行:

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

收件人:

const path = require('path');
app.use(express.static(path.join(__dirname, '../../dist')));

然后将使用package.json文件将必要的文件放入dist目录,然后使用path.join(__dirname确保将其放在正确的位置。