如何将 Monorepo 中带有共享代码的 React App 部署到 Heroku

Question

我正在使用 react-app-rewired 和 customize-cra 设置一个带有共享 TypeScript 代码的多项目 monorepo，而不从 create-react-app 中弹出（设置在 this answer 中描述） .布局如下：

/my-project
|--- /frontend  <-Contains the create-react-app
|--- /shared    <-Contains some typescript source, used by the CRA
...

在本地效果很好。我唯一想不通的是如何将它部署到 Heroku：

如果我使用 Git 仅推送 'frontend' 子目录 (git subtree push --prefix frontend heroku master)，Heroku 构建当然会失败，因为它无法在 /shared 中找到源文件 - 那些甚至没有被推送到服务器。
我尝试使用monorepo buildpack as described here，但结果是一样的。构建失败，无法在 /shared 中找到源文件。
我在评论 here: setting "postinstall": "npm install --prefix frontend in package.json. Although it seemed to build, accessing https://myap123.herokuapp.com and https://myap123.herokuapp.com/frontend yield 404 中尝试了“hacky”解决方案。
我也尝试了评论here中的解决方案：将release: cd frontend && npm install && npm run build放入procfile。相同的行为：它似乎可以构建，但无法从浏览器访问 (404)。

虽然有很多关于从 monorepo 部署项目的资源，还有许多其他关于在 React 和 Node 项目之间共享代码的资源，但我一直找不到任何对两者都有效的资源：共享代码，and 将引用该代码的项目部署到 Heroku。在这一点上，我只是专注于尝试部署前端。

如有任何帮助，我们将不胜感激。

Answer 1

简单的答案（来自 this thread）是 Heroku 没有提供在子目录中运行的正确方法。任何解决方案都将是一个 hack，并且这些解决方案将根据您的项目布局而有所不同。

在我的例子中，我通过将 package.json 放在 repo 的根目录中来实现它：

 {
     "scripts": {
       "postinstall": "npm install --prefix backend && npm run build --prefix backend",
       "start": "node backend/dist/app.js"
     }
   }

这不需要procfile。如果是 typescript 项目，确保后端的 package.json 的脚本标签有 "build": "tsc".

对于前端，我放弃了Heroku。相反，我只是将前端部署到 Netlify，这使您可以轻松地从（预构建的）子目录进行部署。因此，在将 Netlify 用于前端和将上述 hack 用于后端之间，我有一个 hacked-together 工作堆栈，直到 Heroku 希望能够正确地让你指定一个子目录，从中到运行（他们声称他们一直在等待NPM Workspaces，从 NPM 7 开始完成）。

如何将 Monorepo 中带有共享代码的 React App 部署到 Heroku

How To Deploy React App w/ Shared Code In Monorepo To Heroku

heroku

reactjs

create-react-app

monorepo