2017-02-21 13 views
2

У меня возникла проблема с созданным с помощью Angular2 веб-сайта. Я построил структуру с помощью Angular CLI. Я тестировал его на своей локальной машине, и он отлично работает. «ng serve» хосты на порту 4200, и вся страница загружается и функционирует так, как должна. Все мои документы передаются ts lint. Я запустил «ng lint» и не получил никаких предупреждений или ошибок.ng serve Не работает на сервере EC2

Однако, когда я загружаю его на свой сервер, «ng serve» не будет работать. Мой сервер - это образ Bitnami, созданный на узле EC2 через Amazon Web Services (AWS). Я установил nodejs, npm и Angular CLI на сервер и проверял, чтобы версии были обновлены. Все они есть.

Когда я первый попытался «нг служить» команда, которую я получил эту ошибку: команда раздел и побежал «нг служить»:

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" 

Я изменил мой угловой-cli.json, чтобы отразить «После» еще раз. (Я не думаю, что это было проблемой, но я думал, что это релевантная информация).

Текущая ошибка заключается в следующем:

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 

Насколько я могу сказать, что есть некоторые Newline характер в обеих моем main.ts и мой polyfill.ts файлах. Я просмотрел их и ничего не нашел. Я не изменил ни один файл. Эти файлы были сгенерированы угловым кли, и мне не очень удобно их модифицировать самостоятельно.

Как устранить эти ошибки? Нужно ли обновлять пакет? Нужно ли мне менять свои файлы полифония и основные файлы машинописных файлов?

Вот эти файлы, если вам нужно просмотреть их:

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'; 

Спасибо за помощь!

+0

нг служить является веб-сервер разработки. Его не следует использовать в производстве. Используйте 'ng build [--prod]' и используйте реальный веб-сервер для обслуживания статических файлов, сгенерированных в каталоге dist. Вам не нужен узел (если ваш сервер не записан в узле), npm и angular-cli на сервере. –

+0

Спасибо, я буду использовать для этого сборку ng. Тем не менее, я по-прежнему использую этот сервер для разработки. Я бы очень хотел, чтобы с этой целью можно было использовать ng. –

+0

Я столкнулся с одной и той же проблемой, но ее устранили, обновив угловое cli глобально и локально. –

ответ

3

Решение Rj-s работало для меня. Запустите npm install -g @angular/cli для установки по всему миру, а затем npm install @angular/cli для установки локально. Это делается после того, как вы больше не ссылаетесь на старый пакет angular-cli.

+0

Извините, я взял время, чтобы выбрать это как ответ.Я попробовал глобальную переустановку, но я никогда не пробовал локальную установку. Это исправило мою проблему. Благодаря! –

+0

Я удалил угловую линию, так как пакет уже упоминался в угловом/кли, который является последним – Nazeel

9

Если ошибка выше все еще сохраняется, попробуйте это: надеюсь, что это сработает.

открытой угловой cli.json find-

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

и заменить:

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

+1

Спасибо, это отлично работает для меня –

+0

Я рад, что это помогло. :) –