使用 Lerna 时，Heroku 上的 Vue 构建失败答案

【问题标题】：Vue build fails on Heroku when using Lerna使用 Lerna 时，Heroku 上的 Vue 构建失败
【发布时间】：2020-08-17 03:03:07
【问题描述】：

尝试在 Heroku 上使用 Express 后端 + Vue 前端托管 Lerna monorepo。组件分别包含在/packages/server 和/packages/frontend 中。目的是在部署期间构建 Vue 前端，并通过 Express 将其作为静态内容托管。

./package.json

{
  "name": "my_app",
  "private": true,
  "scripts": {
    "bootstrap": "lerna bootstrap",
    "start": "lerna run start --stream",
    "postinstall": "npm run bootstrap",
    "build": "lerna run build --stream"
  },
  "devDependencies": {
    "lerna": "^3.20.2"
  }
}

由于

，我的构建阶段失败了

lerna notice cli v3.20.2
lerna info Executing command in 2 packages: "npm run build"
       frontend: > frontend@0.1.0 build /tmp/build_c2cbb32af790fe0e5e4852ce2bcab8e0/packages/frontend
       frontend: > vue-cli-service build
frontend: sh: 1: vue-cli-service: not found
frontend: npm ERR! code ELIFECYCLE
frontend: npm ERR! syscall spawn
frontend: npm ERR! file sh
frontend: npm ERR! errno ENOENT
frontend: npm ERR! frontend@0.1.0 build: `vue-cli-service build`
frontend: npm ERR! spawn ENOENT

独立的 Vue 存储库不会以这种方式在其构建阶段失败，因此问题很可能是 lerna bootstrap 或 Heroku 构建事物的方式出了问题，但我无法弄清楚问题所在是。

create-react-app 的类似设置不会失败，可能是因为 react-scripts 是一个常规依赖项。

Lerna 和 devDependencies 是否有一些我遗漏的问题，或者这是 Vue 的问题？

【问题讨论】：

标签： node.js vue.js heroku npm lerna

【解决方案1】：

几天后，我终于弄清楚设置有什么问题。问题有两个方面：

首先，vue-cli@4.3.0 似乎可能存在问题，因为所有必需的依赖项都包含在 devDependencies 中，即使启动独立项目也无法使用 NODE_ENV=production 构建。

npx @vue/cli create test
cd test
export NODE_ENV=production
npm install
npm run build

对于本地开发，lerna bootstrap 按预期遵守 NODE_ENV，甚至安装了 devDependencies。但是，当它作为 CI 的一部分运行时，会跳过 devDependencies。

为什么一个独立的 Vue 项目在 Heroku 上构建没有任何问题，这在 nodejs buildpack documentation中有详细说明

默认情况下，Heroku 将安装 package.json 中列出的所有依赖项，位于 dependencies 和 devDependencies 下。

buildpack 仅适用于单层包，因此一旦您在 monorepo 布局中嵌套了包，就不会触及嵌套的 devDependencies。

将 Vue 依赖项移出 devDependencies 解决了我现在的构建问题。

【讨论】：