обновить угловой с версии 5 до 6 - PullRequest
0 голосов
/ 09 мая 2018

Я немного запутался после обновления angular5 до 6 из-за следующих ошибок:

Я обновил версию rxjs с 5.5 до 6.1.0, а также обновил версию машинописного текста до 2.7.2.

Я следил за обновлением версии https://update.angular.io с 5.2 до 6.0 и руководством по обновлению версии rxjs https://github.com/ReactiveX/rxjs/blob/master/MIGRATION.md

здесь произошла ошибка:

yarn run v1.5.1
$ ng serve --open --proxy-config proxy.conf.js 
Could not find module "@angular-devkit/build-angular" from "/home/aravinda/Desktop/example/ui".
Error: Could not find module "@angular-devkit/build-angular" from "/home/aravinda/Desktop/example/ui".
    at Object.resolve (/home/aravinda/Desktop/example/ui/node_modules/@angular-devkit/core/node/resolve.js:141:11)
    at Observable.rxjs_1.Observable [as _subscribe] (/home/aravinda/Desktop/example/ui/node_modules/@angular-devkit/architect/src/architect.js:132:40)
    at Observable.subscribe (/home/aravinda/Desktop/example/ui/node_modules/rxjs/internal/Observable.js:162:69)
    at DoOperator.call (/home/aravinda/Desktop/example/ui/node_modules/rxjs/internal/operators/tap.js:71:23)
    at Observable.subscribe (/home/aravinda/Desktop/example/ui/node_modules/rxjs/internal/Observable.js:159:22)
    at /home/aravinda/Desktop/example/ui/node_modules/rxjs/internal/util/subscribeTo.js:22:31
    at Object.subscribeToResult (/home/aravinda/Desktop/example/ui/node_modules/rxjs/internal/util/subscribeToResult.js:7:45)
    at MergeMapSubscriber._innerSub (/home/aravinda/Desktop/example/ui/node_modules/rxjs/internal/operators/mergeMap.js:132:38)
    at MergeMapSubscriber._tryNext (/home/aravinda/Desktop/example/ui/node_modules/rxjs/internal/operators/mergeMap.js:129:14)
    at MergeMapSubscriber._next (/home/aravinda/Desktop/example/ui/node_modules/rxjs/internal/operators/mergeMap.js:112:18)
error An unexpected error occurred: "Command failed.
Exit code: 1
Command: sh
Arguments: -c ng serve --open --proxy-config proxy.conf.js 

Ответы [ 4 ]

0 голосов
/ 08 июня 2018

Следуйте инструкциям по этой ссылке Обновление Angular 5.2 до Angular 6 Visual Studio Mac 7.5.2 с использованием ядра Asp.net 2.1 . Это решение для visual studio 2017 и visual studio для mac

0 голосов
/ 09 мая 2018

Пожалуйста, следуйте инструкциям по обновлению, упомянутым ниже

  1. Убедитесь, что ваша версия nodeJS 8.9 +
  2. Обновите rxjs до 6.0.0-beta.0, см. Руководство по обновлению RxJS для получения дополнительной информации. В RxJS v6 произошли серьезные изменения, поэтому сначала сделайте ваш код совместимым с последней версией RxJS.
  3. удалить модели узлов, затем npm установить дальнейшее обновление npm cli глобально

     npm uninstall -g @angular/cli
     npm cache verify
    

    если ваша версия npm меньше 5, вы должны сделать

     npm cache clean
     npm install --save-dev @angular/cli@next
     npm install 
    
  4. для обновления пакетов Angular Framework до версии v6

     ng update @angular/core
    
  5. обновление углового материала

     ng update @angular/material
    
  6. делает машинописный код независимым, чтобы он не нуждался в зависимости

     npm install -g rxjs-tslint
     rxjs-5-to-6-migrate -p src/tsconfig.app.json
    
  7. изменить версию углового пакета в package.json на ^ 6.0.0-rc.5

     "dependencies": {
     "@angular/animations": "^6.0.0-rc.5",
     "@angular/cdk": "^6.0.0-rc.12",
     "@angular/common": "^6.0.0-rc.5",
     "@angular/core": "^6.0.0-rc.5",
     "@angular/forms": "^6.0.0-rc.5",
     "@angular/http": "^6.0.0-rc.5",
     "@angular/material": "^6.0.0-rc.12",
     "@angular/platform-browser": "^6.0.0-rc.5",
     "@angular/platform-browser-dynamic": "^6.0.0-rc.5",
     "@angular/router": "^6.0.0-rc.5",
     "core-js": "^2.5.5",
     "karma-jasmine": "^1.1.1",
     "rxjs": "^6.0.0-uncanny-rc.7",
     "rxjs-compat": "^6.0.0-uncanny-rc.7",
     "zone.js": "^0.8.26"
     },
    "devDependencies": {
    "@angular-devkit/build-angular": "~0.5.0",
    "@angular/cli": "^6.0.0-rc.5",
    "@angular/compiler-cli": "^6.0.0-rc.5",
    "@types/jasmine": "2.5.38",
    "@types/node": "~8.9.4",
    "codelyzer": "~4.1.0",
    "jasmine-core": "~2.5.2",
    "jasmine-spec-reporter": "~3.2.0",
    "karma": "~1.4.1",
    "karma-chrome-launcher": "~2.0.0",
    "karma-cli": "~1.0.1",
    "karma-coverage-istanbul-reporter": "^0.2.0",
    "karma-jasmine": "~1.1.0",
    "karma-jasmine-html-reporter": "^0.2.2",
     "postcss-loader": "^2.1.4",
     "protractor": "~5.1.0",
     "ts-node": "~5.0.0",
     "tslint": "~5.9.1",
     "typescript": "^2.7.2"
     }
    
  8. Обновление углового формата конфигурации cli

    ng update @angular/cli --migrate-only --from=1.7.4
    
  9. в случае, если вы получили ошибку при машинописи

    npm install typescript@2.7.2
    
  10. запустить ng serve, чтобы попробовать его.
0 голосов
/ 02 июня 2018

Перейдите по этой ссылке для обновления до угловой 6

Как обновить / обновить с Angular 4 до Angular 5 +

Теперь откройте файл boot.server.ts из клиентского приложения

и измените следующую строку кода

import 'reflect-metadata';
import 'zone.js';
import 'rxjs/add/operator/first';
import { APP_BASE_HREF } from '@angular/common';
import { enableProdMode, ApplicationRef, NgZone, ValueProvider } from '@angular/core';
import { platformDynamicServer, PlatformState, INITIAL_CONFIG } from '@angular/platform-server';
import { createServerRenderer, RenderResult } from 'aspnet-prerendering';
import { AppModule } from './app/app.server.module';

enableProdMode();

export default createServerRenderer(params => {
    const providers = [
        { provide: INITIAL_CONFIG, useValue: { document: '<app></app>', url: params.url } },
        { provide: APP_BASE_HREF, useValue: params.baseUrl },
        { provide: 'BASE_URL', useValue: params.origin + params.baseUrl },
    ];

    return platformDynamicServer(providers).bootstrapModule(AppModule).then(moduleRef => {
        const appRef: ApplicationRef = moduleRef.injector.get(ApplicationRef);
        const state = moduleRef.injector.get(PlatformState);
        const zone = moduleRef.injector.get(NgZone);

        return new Promise<RenderResult>((resolve, reject) => {
            zone.onError.subscribe((errorInfo: any) => reject(errorInfo));
            appRef.isStable.first(isStable => isStable).subscribe(() => {
                // Because 'onStable' fires before 'onError', we have to delay slightly before
                // completing the request in case there's an error to report
                setImmediate(() => {
                    resolve({
                        html: state.renderToString()
                    });
                    moduleRef.destroy();
                });
            });
        });
    });
});

к приведенной ниже строке кода

import 'reflect-metadata';
import 'zone.js';
import 'rxjs/add/operator/first';
import { APP_BASE_HREF } from '@angular/common';
import { enableProdMode, ApplicationRef, NgZone, ValueProvider } from '@angular/core';
import { platformDynamicServer, PlatformState, INITIAL_CONFIG } from '@angular/platform-server';
import { createServerRenderer, RenderResult } from 'aspnet-prerendering';
import { AppModule } from './app/app.server.module';

enableProdMode();

export default createServerRenderer(params => {
    const providers = [
        { provide: INITIAL_CONFIG, useValue: { document: '<app></app>', url: params.url } },
        { provide: APP_BASE_HREF, useValue: params.baseUrl },
        { provide: 'BASE_URL', useValue: params.origin + params.baseUrl },
    ];

    return platformDynamicServer(providers).bootstrapModule(AppModule).then(moduleRef => {
        const appRef: ApplicationRef = moduleRef.injector.get(ApplicationRef);
        const state = moduleRef.injector.get(PlatformState);
        const zone: NgZone = moduleRef.injector.get(NgZone);

        return new Promise<RenderResult>((resolve, reject) => {
            zone.onError.subscribe((errorInfo: any) => reject(errorInfo));
            appRef.isStable.subscribe(() => {
                // Because 'onStable' fires before 'onError', we have to delay slightly before
                // completing the request in case there's an error to report
                setImmediate(() => {
                    resolve({
                        html: state.renderToString()
                    });
                    moduleRef.destroy();
                });
            });
        });
    });
});

Приложение будет работать на последней версии Angular

0 голосов
/ 09 мая 2018

У меня была такая же проблема, добавьте пакет rxjs-compat, чтобы проект решил мою проблему.

, пожалуйста, попробуйте этот подход:

добавьте этот элемент "rxjs-compat": "^6.1.0" в dependencies раздел в package.json и выполните эту команду:

npm install --save

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...