Question

我创建了一个公共文件夹来保存我的js和css文件。我还有一些我需要访问的node_modules，所以我把那个目录公之于众。现在，当我运行位于此处的应用https://sleepy-anchorage-14491.herokuapp.com/时，它告诉我找不到<?php $point = 1000; $points = 1; if (($point < 1000) || ($point == 0)) { echo '<h4>OK</h4>'; }。

这是我的index.html：

app\main.js

这是我的server.js

    <!DOCTYPE html>
<html>
  <head>
    <title>Angular QuickStart</title>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <link rel="stylesheet" href="https://bootswatch.com/cyborg/bootstrap.min.css">
    <link rel="stylesheet" href="/css/styles.css">

    <!-- Polyfill(s) for older browsers -->
    <script src="/core-js/client/shim.min.js"></script>

    <script src="/zone.js/dist/zone.js"></script>
    <script src="/systemjs/dist/system.src.js"></script>

    <script src="/js/systemjs.config.js"></script>
    <script>
      System.import('app').catch(function(err){ console.error(err); });
    </script>
  </head>

  <body>
    <base href="/">
    <my-app>Loading AppComponent content here ...</my-app>
  </body>
</html>

这是package.json

var express = require('express');
var path = require('path');
var app = express();

app.use(express.static(path.join(__dirname, 'public')));
app.use(express.static(path.join(__dirname, 'node_modules')));


var server = require('http').createServer(app);


server.listen(process.env.PORT || 3000);

// When the root director is requested, return the index.html page.
app.get('/',function(req,res){
    res.sendFile(__dirname + '/index.html');
});

Answer 1

答案已经迟到但仍然是尝试更新你的package.json文件
1.将所有devDependencies移动到依赖项
2.添加你在本地使用的节点和npm版本的引擎它将告诉heroku在服务器上安装这些版本

{ 
 "name": "angulardemo",
 "version": "1.0.0",
 "description": 
 "angulardemo",
 "main": "server.js",
 "scripts": {
 "start": "node app.js",
 "postinstall": "ng build --prod",
 "build": "ng build"
 },
 "keywords": [],
 "author": "",
 "license": "MIT",
 "dependencies": {
 "@angular/common": "~2.4.0",
 "@angular/compiler": "~2.4.0",
 "@angular/core": "~2.4.0",
 "@angular/forms": "~2.4.0",
 "@angular/http": "~2.4.0",
 "@angular/platform-browser": "~2.4.0",
 "@angular/platform-browser-dynamic": "~2.4.0",
 "@angular/router": "~3.4.0",
 "angular-in-memory-web-api": "~0.2.4",
 "core-js": "^2.4.1",
 "ejs": "^2.5.5",
 "express": "^4.14.1",
 "rxjs": "5.0.1",
 "systemjs": "0.19.40",
 "zone.js": "^0.7.4",
 "concurrently": "^3.1.0",
 "lite-server": "^2.2.2",
 "typescript": "~2.0.10",
 "canonical-path": "0.0.2",
 "http-server": "^0.9.0",
 "tslint": "^3.15.1",
 "lodash": "^4.16.4",
 "jasmine-core": "~2.4.1",
 "karma": "^1.3.0",
 "karma-chrome-launcher": "^2.0.0",
 "karma-cli": "^1.0.1",
 "karma-jasmine": "^1.0.2",
 "karma-jasmine-html-reporter": "^0.2.2",
 "protractor": "~4.0.14",
 "rimraf": "^2.5.4",
 "@types/node": "^6.0.46",
 "@types/jasmine": "^2.5.36"
 },
 "devDependencies": {
 },
 "engines": {
 "node": "6.11.1", --> write your npm version to tell heroku which version to install there (command: node -v) 
 "npm": "3.10.10" --> command: npm -v
 }
}

在@NgModule里面的app.module.component文件中添加
**bootstrap: [RootComponent]**
它会告诉角度加载根组件所有其他组件应该在内部声明
如果您在index.html中有多个组件，则应在 bootstrap: [RootComponent,comp1,comp2] 中添加所有组件，但这不是一个好习惯。因此，只将root添加到bootstrap并使其他组件成为root的子项。

声明：[ COMP1， COMP2， COMP3， COMP4 ]

app / main.js在部署到heroku时抛出404？

1 个答案: