Question

我对使用Angular2创建的网站有疑问。我用Angular CLI构建了框架。我已经在我的本地机器上进行了彻底的测试，它完美无缺。＆＃34; ng serve＆＃34;端口4200上的主机和整个页面加载和功能应该如此。我的所有文件都通过了ts lint。我跑了＆＃34; ng lint＆＃34;并且没有收到任何警告或错误。

然而，当我将它上传到我的服务器时，＆＃34; ng serve＆＃34;不管用。我的服务器是通过Amazon Web Services（AWS）在EC2节点上创建的Bitnami映像。我将nodejs，npm和Angular CLI安装到服务器并检查以确保版本是最新的。所有这些都是。

当我第一次尝试＆＃34; ng服务＆＃34;命令我收到了这个错误：

Environment configuration does not contain "environmentSource" entry.

A new environmentSource entry replaces the previous source entry inside environments.

    To migrate angular-cli.json follow the example below:

    Before:

    "environments": {
      "source": "environments/environment.ts",
      "dev": "environments/environment.ts",
      "prod": "environments/environment.prod.ts"
    }


    After:

    "environmentSource": "environments/environment.ts",
    "environments": {
      "dev": "environments/environment.ts",
      "prod": "environments/environment.prod.ts"

我改变了我的angular-cli.json以反映＆＃34; After：＆＃34;部分并运行＆＃34; ng服务＆＃34;命令再次。（我不认为这是问题所在，但我认为这是相关信息）。

目前的错误是：

ERROR in ./src/main.ts
Module build failed: TypeError: Cannot read property 'newLine' of undefined
    at Object.getNewLineCharacter (/opt/bitnami/apache2/htdocs/Logan/ProjX-Eng316/node_modules/typescript/lib/typescript.js:8062:20)
    at Object.createCompilerHost (/opt/bitnami/apache2/htdocs/Logan/ProjX-Eng316/node_modules/typescript/lib/typescript.js:44978:26)
    at Object.ngcLoader (/opt/bitnami/apache2/htdocs/Logan/ProjX-Eng316/node_modules/@ngtools/webpack/src/loader.js:350:33)
 @ multi webpack-dev-server/client?http://localhost:4200/ ./src/main.ts

ERROR in ./src/polyfills.ts
Module build failed: TypeError: Cannot read property 'newLine' of undefined
    at Object.getNewLineCharacter (/opt/bitnami/apache2/htdocs/Logan/ProjX-Eng316/node_modules/typescript/lib/typescript.js:8062:20)
    at Object.createCompilerHost (/opt/bitnami/apache2/htdocs/Logan/ProjX-Eng316/node_modules/typescript/lib/typescript.js:44978:26)
    at Object.ngcLoader (/opt/bitnami/apache2/htdocs/Logan/ProjX-Eng316/node_modules/@ngtools/webpack/src/loader.js:350:33)
 @ multi ./src/polyfills.ts

据我所知，我的main.ts和polyfill.ts文件中都有一些newLine字符。我看了他们一眼，什么都没发现。我没有改变任何一个文件。这些文件是由角度cli生成的，我自己也不够舒服地修改它们。

如何解决这些错误？我需要更新包裹吗？我是否需要更改我的polyfill和主要打字稿文件？

以下是这些文件，如果您需要查看它们：

main.ts：

import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
import { enableProdMode } from '@angular/core';
import { environment } from './environments/environment';
import { AppModule } from './app/app.module';

if (environment.production) {
  enableProdMode();
}

platformBrowserDynamic().bootstrapModule(AppModule);

polyfills.ts：

 // This file includes polyfills needed by Angular and is loaded before the app.
    // You can add your own extra polyfills to this file.
    import 'core-js/es6/symbol';
    import 'core-js/es6/object';
    import 'core-js/es6/function';
    import 'core-js/es6/parse-int';
    import 'core-js/es6/parse-float';
    import 'core-js/es6/number';
    import 'core-js/es6/math';
    import 'core-js/es6/string';
    import 'core-js/es6/date';
    import 'core-js/es6/array';
    import 'core-js/es6/regexp';
    import 'core-js/es6/map';
    import 'core-js/es6/set';
    import 'core-js/es6/reflect';

    import 'core-js/es7/reflect';
    import 'zone.js/dist/zone';

    // If you need to support the browsers/features below, uncomment the import
    // and run `npm install import-name-here';
    // Learn more in https://angular.io/docs/ts/latest/guide/browser-support.html

    // Needed for: IE9
    // import 'classlist.js';

    // Animations
    // Needed for: All but Chrome and Firefox, Not supported in IE9
    // import 'web-animations-js';

    // Date, currency, decimal and percent pipes
    // Needed for: All but Chrome, Firefox, Edge, IE11 and Safari 10
    // import 'intl';

    // NgClass on SVG elements
    // Needed for: IE10, IE11
    // import 'classlist.js';

感谢您的帮助！

Answer 1

如果上述错误仍然存在，请尝试：希望它能正常工作。

打开angular-cli.json 发现 -

“environments”：{“source”：“environments / environment.ts”，“dev”： “environments / environment.ts”，“prod”： “environments / environment.prod.ts”}

并替换为：

“environmentSource”：“environments / environment.ts”，“environment”：{ “dev”：“environment / environment.ts”，“prod”： “environments / environment.prod.ts”}

Answer 2

Rj-s的解决方案对我有用。运行npm install -g @angular/cli以全局安装，然后运行npm install @angular/cli以在本地安装。确保您不再引用旧的angular-cli包之后的确定。

Answer 3

检查您的服务器或代理（nginx、tomcat 等）是否指向您应用中的 /dist 文件夹。例如，~/your-app-name/dist 目录（在您的 EC2 中）。

您不应该在 EC2 中构建。您假设在本地构建，然后递归 (-r) scp 将 /dist 文件夹中的文件放入 EC2。

我的猜测是：在 EC2 中，您没有将服务器指向 /dist 文件夹。

ng服务在EC2服务器上不起作用

3 个答案: