我在更新到Angular 6后部署到Heroku时收到错误页面报告：Error: ENOENT: no such file or directory, stat '/app/dist/index.html'。一切都在Angular 5上正常工作。
我可以手动或在GitLab上创建构建而没有问题，所以我知道路径很好。我可以部署到我的本地Web服务器或Azure，没有打嗝。我只遇到了Heroku环境的问题。
我已尝试指定引擎的确切版本，但这并未导致任何可识别的更改。
以下是构建过程中的Heroku输出：
Counting objects: 1, done.
Writing objects: 100% (1/1), 195 bytes | 195.00 KiB/s, done.
Total 1 (delta 0), reused 0 (delta 0)
remote: Compressing source files... done.
remote: Building source:
remote:
remote: -----> Node.js app detected
remote:
remote: -----> Creating runtime environment
remote:
remote: NPM_CONFIG_LOGLEVEL=error
remote: NODE_VERBOSE=false
remote: NODE_ENV=heroku
remote: NODE_MODULES_CACHE=false
remote:
remote: -----> Installing binaries
remote: engines.node (package.json): >=8.9.4
remote: engines.npm (package.json): >=5.6.0
remote: engines.yarn (package.json): >=1.5.1
remote:
remote: Resolving node version >=8.9.4...
remote: Downloading and installing node 10.4.0...
remote: Bootstrapping npm >=5.6.0 (replacing 6.1.0)...
remote: npm 6.1.0 installed
remote: Resolving yarn version >=1.5.1...
remote: Downloading and installing yarn (1.7.0)...
remote: Installed yarn 1.7.0
remote:
remote: -----> Restoring cache
remote: Skipping cache restore (disabled)
remote:
remote: -----> Building dependencies
remote: Installing node modules (yarn.lock)
remote: yarn install v1.7.0
remote: [1/4] Resolving packages...
remote: [2/4] Fetching packages...
remote: (node:256) [DEP0005] DeprecationWarning: Buffer() is deprecated due to security and usability issues. Please use the Buffer.alloc(), Buffer.allocUnsafe(), or Buffer.from() methods instead.
remote: info fsevents@1.2.4: The platform "linux" is incompatible with this module.
remote: info "fsevents@1.2.4" is an optional dependency and failed compatibility check. Excluding it from installation.
remote: info fsevents@1.2.3: The platform "linux" is incompatible with this module.
remote: info "fsevents@1.2.3" is an optional dependency and failed compatibility check. Excluding it from installation.
remote: [3/4] Linking dependencies...
remote: warning " > bootstrap@4.0.0-beta" has unmet peer dependency "jquery@>=3.0.0".
remote: warning " > bootstrap@4.0.0-beta" has unmet peer dependency "popper.js@^1.11.0".
remote: [4/4] Building fresh packages...
remote: Done in 55.06s.
remote:
remote: -----> Caching build
remote: Clearing previous node cache
remote: Skipping cache save (disabled by config)
remote:
remote: -----> Pruning devDependencies
remote: Skipping because NODE_ENV is not 'production'
remote:
remote: -----> Build succeeded!
remote: ! Unmet dependencies don't fail yarn install but may cause runtime issues
remote: https://github.com/npm/npm/issues/7494
remote:
remote: -----> Discovering process types
remote: Procfile declares types -> web
remote:
remote: -----> Compressing...
remote: Done: 87.8M
remote: -----> Launching...
remote: Released v62
remote: https://app-name.herokuapp.com/ deployed to Heroku
remote:
remote: Verifying deploy... done.
以下是我的相关项目文件：
Procfile
web: node server.js
server.js
//Install express server
const express = require('express');
const http = require('http');
const path = require('path');
const app = express();
// Serve only the static files from the dist directory
app.use(express.static(__dirname + '/dist'));
app.get('*', (req, res) => {
res.sendFile(path.join(__dirname, 'dist/index.html'));
});
const port = process.env.PORT || 8080;
app.set(port);
const server = http.createServer(app);
server.listen(port, () => console.log('Running…'));
{
"$schema": "./node_modules/@angular/cli/lib/config/schema.json",
"version": 1,
"newProjectRoot": "projects",
"projects": {
"app": {
"root": "",
"sourceRoot": "src",
"projectType": "application",
"architect": {
"build": {
"builder": "@angular-devkit/build-angular:browser",
"options": {
"outputPath": "dist",
"index": "src/index.html",
"main": "src/main.ts",
"tsConfig": "src/tsconfig.json",
"assets": [
"src/assets",
"src/favicon.ico"
],
"styles": [
"node_modules/bootstrap/scss/bootstrap.scss",
"node_modules/font-awesome/scss/font-awesome.scss",
"src/styles.scss"
],
"scripts": [
"node_modules/core-js/client/shim.min.js",
"node_modules/reflect-metadata/Reflect.js"
]
},
"configurations": {
"dev": {
"fileReplacements": [
{
"replace": "src/./environments/environment.ts",
"with": "src/./environments/environment.dev.ts"
}
]
},
"reader": {
"optimization": true,
"outputHashing": "all",
"sourceMap": false,
"extractCss": true,
"namedChunks": false,
"aot": true,
"extractLicenses": true,
"vendorChunk": false,
"buildOptimizer": true,
"fileReplacements": [
{
"replace": "src/./environments/environment.ts",
"with": "src/./environments/environment.reader.ts"
}
]
},
"heroku": {
"optimization": true,
"outputHashing": "all",
"sourceMap": false,
"extractCss": true,
"namedChunks": false,
"aot": true,
"extractLicenses": true,
"vendorChunk": false,
"buildOptimizer": true,
"fileReplacements": [
{
"replace": "src/./environments/environment.ts",
"with": "src/./environments/environment.heroku.ts"
}
]
},
"staging": {
"optimization": true,
"outputHashing": "all",
"sourceMap": false,
"extractCss": true,
"namedChunks": false,
"aot": true,
"extractLicenses": true,
"vendorChunk": false,
"buildOptimizer": true,
"fileReplacements": [
{
"replace": "src/./environments/environment.ts",
"with": "src/./environments/environment.staging.ts"
}
]
},
"production": {
"optimization": true,
"outputHashing": "all",
"sourceMap": false,
"extractCss": true,
"namedChunks": false,
"aot": true,
"extractLicenses": true,
"vendorChunk": false,
"buildOptimizer": true,
"fileReplacements": [
{
"replace": "src/./environments/environment.ts",
"with": "src/./environments/environment.prod.ts"
}
]
}
}
},
"serve": {
"builder": "@angular-devkit/build-angular:dev-server",
"options": {
"browserTarget": "app:build"
},
"configurations": {
"dev": {
"browserTarget": "app:build:dev"
},
"reader": {
"browserTarget": "app:build:reader"
},
"heroku": {
"browserTarget": "app:build:heroku"
},
"staging": {
"browserTarget": "app:build:staging"
},
"production": {
"browserTarget": "app:build:production"
}
}
},
"extract-i18n": {
"builder": "@angular-devkit/build-angular:extract-i18n",
"options": {
"browserTarget": "app:build"
}
},
"test": {
"builder": "@angular-devkit/build-angular:karma",
"options": {
"main": "src/test.ts",
"karmaConfig": "./karma.conf.js",
"scripts": [
"node_modules/core-js/client/shim.min.js",
"node_modules/reflect-metadata/Reflect.js"
],
"styles": [
"node_modules/ng2-toastr/bundles/ng2-toastr.min.css",
"node_modules/bootstrap/scss/bootstrap.scss",
"node_modules/font-awesome/scss/font-awesome.scss",
"src/styles.scss"
],
"assets": [
"src/assets",
"src/favicon.ico"
]
}
},
"lint": {
"builder": "@angular-devkit/build-angular:tslint",
"options": {
"tsConfig": [
"src/tsconfig.json"
],
"exclude": []
}
}
}
},
"app-e2e": {
"root": "",
"sourceRoot": "",
"projectType": "application",
"architect": {
"e2e": {
"builder": "@angular-devkit/build-angular:protractor",
"options": {
"protractorConfig": "./protractor.conf.js",
"devServerTarget": "app:serve"
}
},
"lint": {
"builder": "@angular-devkit/build-angular:tslint",
"options": {
"tsConfig": [
"e2e/tsconfig.json"
],
"exclude": []
}
}
}
}
},
"defaultProject": "app",
"cli": {
"warnings": {
"typescriptMismatch": false
}
},
"schematics": {
"@schematics/angular:class": {
"spec": false
},
"@schematics/angular:component": {
"spec": true,
"inlineStyle": false,
"inlineTemplate": false,
"prefix": "app",
"styleext": "scss"
},
"@schematics/angular:directive": {
"prefix": "app"
}
}
}
{
"name": "app",
"version": "1.99.99",
"angular-cli": {},
"scripts": {
"ng": "ng",
"start": "ng serve",
"dangerzone": "ng serve --host 0.0.0.0",
"dev": "ng build --prod --configuration=dev",
"heroku": "ng build --prod --configuration=heroku",
"prod": "ng build --prod",
"reader": "ng build --prod --configuration=reader",
"staging": "ng build --prod --configuration=staging",
"lint": "tslint \"src/**/*.ts\" --project src/tsconfig.json && tslint \"e2e/**/*.ts\" --project e2e/tsconfig.json",
"lint:fix": "tslint \"src/**/*.ts\" --project src/tsconfig.json --fix && tslint \"e2e/**/*.ts\" --project e2e/tsconfig.json --fix",
"test": "ng test",
"pree2e": "webdriver-manager update --standalone false --gecko false",
"e2e": "protractor"
},
"engines": {
"node": ">=8.9.4",
"npm": ">=5.6.0",
"yarn": ">=1.5.1"
},
"private": true,
"dependencies": {
"@angular-devkit/build-optimizer": "0.7.0-beta.1",
"@angular/animations": "^6.0.3",
"@angular/cdk": "^6.2.0",
"@angular/cli": "^6.0.7",
"@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/material": "^6.2.0",
"@angular/platform-browser": "^6.0.3",
"@angular/platform-browser-dynamic": "^6.0.3",
"@angular/platform-server": "^6.0.3",
"@angular/router": "^6.0.3",
"angular-tree-component": "^7.0.1",
"bootstrap": "4.0.0-beta",
"core-js": "^2.5.7",
"d3": "^4.10.0",
"font-awesome": "^4.7.0",
"hammerjs": "^2.0.8",
"lodash": "^4.17.4",
"moment": "^2.19.3",
"ng2-idle-core": "^6.0.1",
"ng2-split-pane": "^1.4.0",
"ngx-color-picker": "^6.1.0",
"ngx-cookie": "^3.0.1",
"rxjs": "^6.1.0",
"rxjs-compat": "^6.1.0",
"typescript": "2.7.2",
"zone.js": "~0.8.26"
},
"devDependencies": {
"@angular-devkit/build-angular": "~0.7.0-beta.1",
"@types/d3": "^4.10.0",
"@types/jasmine": "^2.5.54",
"@types/lodash": "^4.14.95",
"@types/node": "10.1.4",
"codelyzer": "^4.3.0",
"cross-env": "^5.0.5",
"jasmine": "^3.1.0",
"jasmine-core": "^3.1.0",
"jasmine-spec-reporter": "^4.2.1",
"karma": "^2.0.0",
"karma-chrome-launcher": "^2.2.0",
"karma-cli": "^1.0.1",
"karma-coverage-istanbul-reporter": "^1.2.1",
"karma-jasmine": "^1.0.2",
"karma-jasmine-html-reporter": "^1.1.0",
"karma-remap-istanbul": "^0.6.0",
"node-sass": "^4.5.3",
"protractor": "^5.1.2",
"ts-node": "^6.0.3",
"tslint": "^5.10.0",
"use-yarn": "^2.2.0"
}
}
答案 0 :(得分：0)
事实证明，我在升级过程中删除了postinstall脚本，之后又忽略了添加它。这是修改后的package.json部分，指向该项目的自定义安装后脚本：
{
...
"scripts": {
...
"postinstall": "node scripts/postinstall.js"
},
...
}