Angular 6：Npm 错误！缺少脚本：部署到 heroku 时开始

【问题标题】：Angular 6: Npm ERR! Missing Script: Start when deploying to herokuAngular 6：Npm 错误！缺少脚本：部署到 heroku 时开始
【发布时间】：2018-12-22 23:31:56
【问题描述】：

我有一个简单的 angular 6 应用程序，我已经部署到 heroku，但是当我运行时，

 heroku logs

我收到以下错误

2018-07-15T00:45:51.000000+00:00 app[api]: Build succeeded
2018-07-15T00:45:53.901220+00:00 heroku[web.1]: Starting process with command `npm start`
2018-07-15T00:45:56.221740+00:00 heroku[web.1]: Process exited with status 1
2018-07-15T00:45:56.166323+00:00 app[web.1]: npm ERR! missing script: start
2018-07-15T00:45:56.174458+00:00 app[web.1]:
2018-07-15T00:45:56.174761+00:00 app[web.1]: npm ERR! A complete log of this run can be found in:
2018-07-15T00:45:56.174953+00:00 app[web.1]: npm ERR!     /app/.npm/_logs/2018-07-15T00_45_56_169Z-debug.log
2018-07-15T00:45:56.236130+00:00 heroku[web.1]: State changed from starting to crashed
2018-07-15T00:45:56.238073+00:00 heroku[web.1]: State changed from crashed to starting
2018-07-15T00:45:59.380249+00:00 heroku[web.1]: Starting process with command `npm start`
2018-07-15T00:46:01.530698+00:00 app[web.1]: npm ERR! missing script: start
2018-07-15T00:46:01.544315+00:00 app[web.1]:
2018-07-15T00:46:01.544530+00:00 app[web.1]: npm ERR! A complete log of this run can be found in:
2018-07-15T00:46:01.544632+00:00 app[web.1]: npm ERR!     /app/.npm/_logs/2018-07-15T00_46_01_533Z-debug.log
2018-07-15T00:46:01.624476+00:00 heroku[web.1]: State changed from starting to crashed
2018-07-15T00:46:01.603498+00:00 heroku[web.1]: Process exited with status 1

这是我的 package.json

{
  "name": "product-client",
  "version": "0.0.0",
  "license": "MIT",
  "scripts": {
    "ng": "ng",
    "build": "ng build",
    "test": "ng test",
    "lint": "ng lint",
    "e2e": "ng e2e",
    "postinstall": "grunt sass:production && ng build --aot --prod",
    "start": "ng serve"
  },
  "private": true,
  "dependencies": {
    "@angular/animations": "^6.0.3",
    "@angular/cli": "~6.0.8",
    "@angular/common": "^6.0.3",
    "@angular/compiler": "^6.0.3",
    "@angular/compiler-cli": "^6.0.3",
    "@angular/core": "^6.0.3",
    "@angular/forms": "^6.0.3",
    "@angular/http": "^6.0.3",
    "@angular/platform-browser": "^6.0.3",
    "@angular/platform-browser-dynamic": "^6.0.3",
    "@angular/router": "^6.0.3",
    "@ng-bootstrap/ng-bootstrap": "^2.2.0",
    "angular2-flash-messages": "^2.0.5",
    "bootstrap": "^3.3.7",
    "bootstrap-select-v4": "^1.12.4",
    "brew": "0.0.8",
    "brew-tree": "0.0.2",
    "cities.json": "^1.1.2",
    "core-js": "^2.5.4",
    "igniteui-angular": "^6.1.0",
    "jquery": "^3.3.1",
    "ngx-bootstrap": "^3.0.1",
    "primeicons": "^1.0.0-beta.9",
    "primeng": "^6.0.0",
    "rxjs": "^6.2.1",
    "rxjs-compat": "^6.2.1",
    "tree-cli": "^0.4.12",
    "winston": "^3.0.0",
    "zone.js": "^0.8.26"
  },
  "engines": {
    "node": "8.9.4",
    "npm": "5.6.0"
  },
  "devDependencies": {
    "@angular-devkit/build-angular": "~0.6.8",
    "@angular/language-service": "^6.0.3",
    "@types/jasmine": "~2.8.6",
    "@types/jasminewd2": "~2.0.3",
    "@types/node": "~8.9.4",
    "codelyzer": "~4.2.1",
    "jasmine-core": "~2.99.1",
    "jasmine-spec-reporter": "~4.2.1",
    "karma": "~1.7.1",
    "karma-chrome-launcher": "~2.2.0",
    "karma-coverage-istanbul-reporter": "~2.0.0",
    "karma-jasmine": "~1.1.1",
    "karma-jasmine-html-reporter": "^0.2.2",
    "protractor": "~5.3.0",
    "ts-node": "~5.0.1",
    "tslint": "~5.9.1",
    "typescript": "^2.7.0-dev.20180108"
  }
}

这是我的过程文件

worker: ng serve

这是我的结构

└───src
    ├───app
    │   ├───app-routing
    │   ├───product-detail
    │   ├───product-list
    │   ├───star
    │   └───welcome
    ├───assets
    │   ├───api
    │   │   └───products
    │   └───images
    ├───environments
    └───sass

请注意，在我的本地机器上，当我部署到 heroku 时一切正常，我得到了那个错误，

请注意，它只是一个没有休息 api 的普通角度着陆页

问题

我的代码有什么问题？

【问题讨论】：

  • 从部署到heroku的目录运行$ npm start是否有效？以及如何部署它？使用 cli？

标签： javascript angular typescript heroku npm


【解决方案1】：

您需要安装服务器才能运行您的应用 在本地，我们从终端运行 ng serve 以在本地浏览器上运行我们的应用程序。但是我们需要设置一个 Express 服务器来运行我们的生产就绪应用程序（从创建的 dist 文件夹），以确保轻量级和快速加载。

通过运行安装 Express 服务器：

npm install express path --save

在应用的根目录下创建一个 server.js 文件并粘贴以下代码。

    //Install express server
    const express = require('express');
    const path = require('path');

    const app = express();

    // Serve only the static files form the dist directory
    app.use(express.static(__dirname + '/dist'));

    app.get('/*', function(req,res) {

    res.sendFile(path.join(__dirname+'/dist/index.html'));
    });

    // Start the app by listening on the default Heroku port
    app.listen(process.env.PORT || 8080);

更改启动命令 在 package.json 中，将“start”命令更改为 node server.js，使其变为：

"start": "node server.js"

这是完整的 package.json 的样子。您的可能包含更多，具体取决于您的特定应用程序包。

现在你的包，json应该是这样的

{
  "name": "product-client",
  "version": "0.0.0",
  "license": "MIT",
  "scripts": {
    "ng": "ng",
    "build": "ng build",
    "test": "ng test",
    "lint": "ng lint",
    "e2e": "ng e2e",
    "postinstall": "grunt sass:production && ng build --aot --prod",
    "start": "node server.js"
  },
  "private": true,
  "dependencies": {
    "@angular/animations": "^6.0.3",
    "@angular/cli": "~6.0.8",
    "@angular/common": "^6.0.3",
    "@angular/compiler": "^6.0.3",
    "@angular/compiler-cli": "^6.0.3",
    "@angular/core": "^6.0.3",
    "@angular/forms": "^6.0.3",
    "@angular/http": "^6.0.3",
    "@angular/platform-browser": "^6.0.3",
    "@angular/platform-browser-dynamic": "^6.0.3",
    "@angular/router": "^6.0.3",
    "@ng-bootstrap/ng-bootstrap": "^2.2.0",
    "angular2-flash-messages": "^2.0.5",
    "bootstrap": "^3.3.7",
    "bootstrap-select-v4": "^1.12.4",
    "brew": "0.0.8",
    "brew-tree": "0.0.2",
    "cities.json": "^1.1.2",
    "core-js": "^2.5.4",
    "igniteui-angular": "^6.1.0",
    "jquery": "^3.3.1",
    "ngx-bootstrap": "^3.0.1",
    "primeicons": "^1.0.0-beta.9",
    "primeng": "^6.0.0",
    "rxjs": "^6.2.1",
    "rxjs-compat": "^6.2.1",
    "tree-cli": "^0.4.12",
    "winston": "^3.0.0",
    "zone.js": "^0.8.26"
  },
  "engines": {
    "node": "8.9.4",
    "npm": "5.6.0"
  },
  "devDependencies": {
    "@angular-devkit/build-angular": "~0.6.8",
    "@angular/language-service": "^6.0.3",
    "@types/jasmine": "~2.8.6",
    "@types/jasminewd2": "~2.0.3",
    "@types/node": "~8.9.4",
    "codelyzer": "~4.2.1",
    "jasmine-core": "~2.99.1",
    "jasmine-spec-reporter": "~4.2.1",
    "karma": "~1.7.1",
    "karma-chrome-launcher": "~2.2.0",
    "karma-coverage-istanbul-reporter": "~2.0.0",
    "karma-jasmine": "~1.1.1",
    "karma-jasmine-html-reporter": "^0.2.2",
    "protractor": "~5.3.0",
    "ts-node": "~5.0.1",
    "tslint": "~5.9.1",
    "typescript": "^2.7.0-dev.20180108"
  }
}

【讨论】：

    猜你喜欢
    • 2017-10-16
    • 2021-04-26
    • 1970-01-01
    • 2023-04-07
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2022-11-11
    相关资源
    最近更新 更多
    热门标签
    Java Python linux javascript Mysql C# Docker 算法 前端 SpringBoot Redis Vue spring 设计模式 .net core .net kubernetes c++ 数据库 数据结构 大数据 js 机器学习 微服务 Android Go 程序员 面试 JVM ASP.net core 云原生 人工智能 后端 PHP git CSS golang k8s Nginx Django mybatis 深度学习 多线程 React 架构 devops 爬虫 云计算 Spring Boot LeetCode