Heroku部署vue项目失败：sh: 1: vue-cli-service: not found

剧情介绍

最近写了一个Express + Vue前后端项目demo，打算部署到Heroku

部分目录结构如下

server.js           // Express提供数据接口
package.json

client/             //  Vue前端显示数据
	package.json
	

整个项目都保存到Github上，让Heroku自动部署

前端项目不能在本地打包，不然dist目录将会进入git，这样不太好

所以，部署的时候需要在线上完成打包操作

package.json如下

"scripts": {
    "postinstall": "npm run client-install && npm run client-build",
    "client": "npm start --prefix client",
    "client-build": "npm run build --prefix client",
    "client-install": "npm install --prefix client",
    "start": "node server.js",
    "server": "nodemon server.js --ignore client",
    "dev": "concurrently \"npm run server\" \"npm run client\""
  },

client/package.json

"scripts": {
    "serve": "vue-cli-service serve",
    "build": "vue-cli-service build",
    "start": "npm run serve"
  },

Heroku会自动执行 ： postinstall -> start

所以我在 postinstall 中对client前端项目进行了【依赖安装】和【项目打包】

上面的两个配置文件，在本地执行是没有问题的，

Heroku线上部署

到了Heroku线上部署报错了：

sh: 1: vue-cli-service: not found

截图：

网上的文章，大致说了3个解决方法

1、重新安装
将 文件夹node_modules 删除在执行 npm install 进行重新安装

2、指定路径

./node_modules/.bin/vue-cli-service  build

3、全局安装

npm install @vue/cli-service -g

线下环境确实没问题，不过到了Heroku线上部署就无效

问题解决

进过多番百度，发现有类似文章提到了一个环境变量NODE_ENV=production

查看部署日志，果然发现了类似的设置，Heroku很热心的给我设置了环境变量

修改环境变量

{
"postinstall": "NODE_ENV=development && npm run client-install && npm run client-build && NODE_ENV=production"
}

总算部署成功了

最后的package.json文件

"scripts": {
    "postinstall": "NODE_ENV=development && npm run client-install && npm run client-build && NODE_ENV=production",
    "client": "npm start --prefix client",
    "client-build": "npm run build --prefix client",
    "client-install": "npm install --prefix client",
    "start": "node server.js",
    "server": "nodemon server.js --ignore client",
    "dev": "concurrently \"npm run server\" \"npm run client\""
  }

部署完后的地址
https://web-node-app.herokuapp.com/

参考
linux 搭建 jenkins 前端自动构建时，老是提示 sh: vue-cli-service: command not found