部署全栈节点应用 npm / package.json 架构

Question

我有a repository，它包含一个后端（Node/Express）和一个前端客户端，例如：

├── build
├── config
├── coverage
│   └── lcov-report
├── dist
│   └── static
├── server (node/express server)
│   ├── coverage
│   ├── docs
|   ├── src
│   ├── etc
│   └── package.json
|
├── src (Vue.js : client code)
│   ├── api
│   ├── assets
│   ├── components
│   ├── router
│   └── store
└── static
└── package.json

我有两个 package.json 文件，一个用于客户端，一个用于服务器。

1. 我在部署 Heroku 等服务时遇到问题，因为他们不希望在一个存储库中有两个不同的 npm 包（我认为）。如何使用此设置部署到 Heroku（或其他）？
2. 为应用程序的两个部分创建一个 package.json 文件会更明智吗？

在同一个 package.json 中同时包含前端和后端部分的优点和缺点是什么？

Answer 1

您可以使用heroku-postbuild 并在推送到 Heroku 的单个 git 存储库中为您的客户端和服务器维护单独的 package.json 文件。

例如，在我的一个项目中，目录结构如下所示：

|-- package.json (for node/express server)
|-- Procfile
|-- www
    |--client
       |-- package.json (for Ionic/Angular client app)
       |-- ...
    |--server
       |--- ...
    |-- server.js (top level node.js/express script for server)

在我的顶级 package.json 中，我有：

"scripts": {
    "start": "node www/server.js",
    "heroku-postbuild": "cd www/client && npm install && npm run build"
 },

在我的客户端 package.json 我有：

 "scripts": {
    "build": "ionic-app-scripts build",
    ...
 },

最后在我的 Procfile 中：

web: npm start

使用此解决方案，Heroku 运行我的服务器并在每个 Heroku 构建上构建我的客户端代码。

我认为客户端和服务器 package.jsons 应该分开保存有几个原因。一方面，您真的不希望将所有服务器端代码捆绑到客户端中。

Answer 2

我在部署到 heroku 时遇到了类似的问题。 我使用一个同时调用的包通过服务器端 package.json 中的启动脚本来启动客户端和服务器端。我还使用 node 的内置代理功能通过在客户端 package.json 中添加一行来将任何请求从客户端发送到服务器。

顺便说一句，我在客户端使用 create-react-app，所以有些东西看起来有点奇怪。

我的文件夹结构是

Server folder
   Server package.json
   Client folder
      Client package.json

服务器包.json：

"scripts": {
  "start": "concurrently \"npm run server\" \"npm run client\"",
  "server": "cross-env NODE_ENV=production node server.js",
  "server-dev": "nodemon --watch ./ --exec babel-node -- server.js",
  "client": "node start-client.js",
  "dev": "concurrently \"npm run server-dev\" \"npm run client\"",
  "lint": "eslint ."
 },

客户端包.json：

"proxy": "http://localhost:3001",

我假设 Heroku 只是寻找一个启动脚本并运行它。 我认为在你的服务器和客户端之间有一定程度的分离是一个好主意，所以我不建议尝试将它们全部放在一个 package.json 中

如果您愿意，您可以通过谷歌搜索以下关键字在线找到教程：heroku 并发服务器客户端

顺便说一句，如果你这样设置就不需要 CORS

干杯

Answer 3

我也遇到过类似的问题。我发现最简单的解决方案是拥有两个独立的 Git 存储库，一个用于后端，一个用于前端。那么每个仓库的根目录下只有一个package.json。

然后您可以创建第三个存储库并使用 Git 子模块来包含后端和前端存储库。您将使用“组合”存储库进行开发工作，但您将部署单独的存储库。这提供了与部署工具的最大兼容性，同时允许您仍然维护单个存储库以便于开发。