我在heroku中运行app时遇到了一些问题。
日志:
2017-10-22T20:41:16.421991+00:00 app[web.1]: npm ERR! errno ENOENT
2017-10-22T20:41:16.411165+00:00 app[web.1]: > ng serve
2017-10-22T20:41:16.411149+00:00 app[web.1]:
2017-10-22T20:41:16.421630+00:00 app[web.1]: npm ERR! file sh
2017-10-22T20:41:16.411165+00:00 app[web.1]:
2017-10-22T20:41:16.416314+00:00 app[web.1]: sh: 1: ng: not found
的package.json:
"scripts": {
"ng": "ng",
"start": "ng serve",
"build": "ng build",
"test": "ng test",
"lint": "ng lint",
"e2e": "ng e2e"
},
ENV:
Angular 4,我没有使用NodeJS express。我已经在Heroku中部署了应用程序。
答案 0 :(得分:1)
您可以通过设置环境让heroku建立开发依赖关系:
NPM_CONFIG_PRODUCTION
至false
。 (how?)
或者您可以移动(角度9)
@angular/cli
,
@angular/compiler-cli
@angular-devkit/build-angular
typescript
从devDependencies到依赖关系。
所以,运行:
npm i @angular/cli @angular-devkit/build-angular @angular/compiler-cli typescript --save-prod
或您的版本(如果已指定)。例如:
npm i @angular/cli@9.1.x @angular-devkit/build-angular@0.901.x @angular/compiler-cli@9.1.x typescript@3.8.x --save-prod
答案 1 :(得分:0)
Heroku需要一些服务器配置,
我正在使用快递:
const express = require('express');
const app = express();
app.use(express.static(__dirname + '/dist'));
app.get('/*', function(req, res) {
res.sendFile(__dirname + '/dist/index.html');
});
app.listen(process.env.PORT || 4200);
console.log('SERVER RUNNING...');
和您的package.json也必须有所不同,这是因为Express.js(注意“开始”,安装后以及将“开发依赖项”移至“依赖项”):
{
"name": "app_angular",
"version": "0.0.0",
"license": "MIT",
"scripts": {
"ng": "ng",
"start": "node server.js",
"build": "ng build",
"test": "ng test",
"lint": "ng lint",
"e2e": "ng e2e",
"heroku-postbuild": "ng build --prod",
"postinstall": "ng build --prod"
},
"private": true,
"dependencies": {
"@angular-devkit/build-angular": "~0.6.8",
"@angular/animations": "6.0.4",
"@angular/common": "6.0.4",
"@angular/compiler": "6.0.4",
"@angular/compiler-cli": "6.0.4",
"@angular/core": "6.0.4",
"@angular/forms": "6.0.4",
"@angular/http": "6.0.4",
"@angular/language-service": "6.0.4",
"@angular/platform-browser": "6.0.4",
"@angular/platform-browser-dynamic": "6.0.4",
"@angular/router": "6.0.4",
"@auth0/angular-jwt": "^2.0.0",
"@types/jasmine": "~2.8.3",
"@types/jasminewd2": "~2.0.2",
"@types/node": "^6.0.117",
"chart.js": "^2.7.2",
"codelyzer": "^4.4.4",
"core-js": "^2.4.1",
"font-awesome": "^4.7.0",
"jasmine-core": "~2.8.0",
"jasmine-spec-reporter": "~4.2.1",
"karma": "^2.0.5",
"karma-chrome-launcher": "~2.2.0",
"karma-coverage-istanbul-reporter": "^1.2.1",
"karma-jasmine": "~1.1.0",
"karma-jasmine-html-reporter": "^0.2.2",
"moment": "^2.18.1",
"ng2-currency-mask": "^4.1.0",
"ng2-toasty": "^4.0.3",
"node": "10.1.0",
"npm": "^6.4.1",
"primeflex": "^1.0.0-rc.1",
"primeicons": "^1.0.0-beta.10",
"primeng": "^6.1.4",
"protractor": "~5.1.2",
"rxjs": "^6.3.2",
"rxjs-compat": "^6.3.2",
"ts-node": "~4.1.0",
"tslint": "~5.9.1",
"typescript": "2.7.2",
"zone.js": "^0.8.26"
},
"devDependencies": {},
"engines": {
"node": "10.0.0",
"npm": "^6.0.0"
}
}
简历:不幸的是,开发并上传到Heroku并不简单,但是您会到达那里!
答案 2 :(得分:0)
在生产环境中,Angular代码被部署为静态代码。
只需运行:
{{1}}
部署作为静态网站生成的dist文件夹。