从Angular 2.2.3升级到2.4.0

我刚刚使用npm-check-updates将我的Angular项目从Angular 2.2.3升级到2.4.0。使用angular-cli进行编译时，我收到此警告。虽然应用程序本身似乎运行良好。从Angular 2.2.3升级到2.4.0

>ng build 
--snip-- 
ERROR in AppModule is not an NgModule

问题是它没有给我任何有关问题的信息。如果需要其他代码或信息，我可以提供。

新的package.json：

"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", 
    "bootswatch": "^3.3.7", 
    "core-js": "^2.4.1", 
    "express": "^4.14.0", 
    "font-awesome": "^4.7.0", 
    "mongoose": "^4.7.4", 
    "morgan": "^1.7.0", 
    "rxjs": "5.0.1", 
    "ts-helpers": "^1.1.2", 
    "zone.js": "^0.7.4"

旧的package.json

"dependencies": { 
    "@angular/common": "2.2.3", 
    "@angular/compiler": "2.2.3", 
    "@angular/core": "2.2.3", 
    "@angular/forms": "2.2.3", 
    "@angular/http": "2.2.3", 
    "@angular/platform-browser": "2.2.3", 
    "@angular/platform-browser-dynamic": "2.2.3", 
    "@angular/router": "3.2.3", 
    "bootswatch": "^3.3.7", 
    "core-js": "^2.4.1", 
    "express": "^4.14.0", 
    "font-awesome": "^4.7.0", 
    "mongoose": "^4.7.1", 
    "morgan": "^1.7.0", 
    "rxjs": "5.0.0-beta.12", 
    "ts-helpers": "^1.1.1", 
    "zone.js": "^0.6.23" 
}

app.module.ts

import { BrowserModule } from '@angular/platform-browser'; 
import { NgModule } from '@angular/core'; 
import { FormsModule } from '@angular/forms'; 
import { HttpModule } from '@angular/http'; 
import { routes } from './app.router'; 

import { AppComponent } from './app.component'; 
import { BoardIndexComponent } from './board-index/board-index.component'; 
import { ViewForumComponent } from './view-forum/view-forum.component'; 
import { ViewTopicComponent } from './view-topic/view-topic.component'; 
import { PostingComponent } from './posting/posting.component'; 

import { DatabaseService } from './services/database.service'; 

@NgModule({ 
    declarations: [ // Components and directives 
    AppComponent, 
    BoardIndexComponent, 
    ViewForumComponent, 
    ViewTopicComponent, 
    PostingComponent 
    ], 
    imports: [ // Module dependencies 
    BrowserModule, 
    FormsModule, 
    HttpModule, 
    routes 
    ], 
    providers: [DatabaseService], // Services 
    bootstrap: [AppComponent] // Root component 
}) 
export class AppModule { }

来源

2016-12-22 tatersalad58

确保你已经将你的angular-cli版本更新到beta 24（全局和本地） – Brocco

使用[email protected]（本地和全局），此问题仍然存在。 – tatersalad58

我建议你只是运行'ng init'，然后按d来检查差异并实现差异，我做了我自己和我为我工作。也看看这个https://github.com/angular/angular-cli/issues/3157 – Majid

制作ÿ我们的package.json文件与此类似

"dependencies": { 
    "@angular/common": "2.4.1", 
    "@angular/compiler": "2.4.1", 
    "@angular/compiler-cli": "2.4.1", 
    "@angular/core": "2.4.1", 
    "@angular/forms": "2.4.1", 
    "@angular/http": "2.4.1", 
    "@angular/platform-browser": "2.4.1", 
    "@angular/platform-browser-dynamic": "2.4.1", 
    "@angular/router": "3.4.1", 
    "@angular/upgrade": "2.4.1", 
    "@angular/material": "2.0.0-beta.0", 
    "bootstrap": "^3.3.7", 
    "concurrently": "^3.1.0", 
    "core-js": "^2.4.1", 
    "hammerjs": "^2.0.8", 
    "reflect-metadata": "^0.1.9", 
    "rxjs": "^5.0.2", 
    "systemjs": "^0.19.41", 
    "zone.js": "^0.7.4" 
    }, 
    "devDependencies": { 
    "@types/chai": "^3.4.34", 
    "@types/hammerjs": "^2.0.33", 
    "@types/jasmine": "^2.5.38", 
    "@types/selenium-webdriver": "2.53.38", 
    "angular-cli": "1.0.0-beta.24", 
    "codelyzer": "~2.0.0-beta.4", 
    "jasmine-core": "2.5.2", 
    "jasmine-spec-reporter": "2.7.0", 
    "karma": "1.3.0", 
    "karma-chrome-launcher": "^2.0.0", 
    "karma-cli": "^1.0.1", 
    "karma-jasmine": "^1.1.0", 
    "karma-remap-istanbul": "^0.4.0", 
    "protractor": "4.0.14", 
    "ts-node": "1.7.2", 
    "tslint": "4.2.0", 
    "typescript": "2.0.10" 
    }

并再次运行“npm install”。如果在此之前清理了node_modules文件夹，甚至会更好。之后运行“npm -g angular-cli @ latest”。更超过在角cli.json文件属性“资产”现在应该数组，而不是标量： “资产”：[“资产”]和现在默认部分应被添加：

"defaults": { 
    "styleExt": "css", 
    "prefixInterfaces": false, 
    "inline": { 
     "style": true, 
     "template": true 
    }, 
    "spec": { 
     "class": false, 
     "component": true, 
     "directive": true, 
     "module": false, 
     "pipe": true, 
     "service": true 
    }

像这样：

{ 
    "project": { 
    "version": "1.0.0-beta.24", 
    "name": "testcli" 
    }, 
    "apps": [ 
    { 
     "root": "src", 
     "outDir": "dist", 
     "assets": ["assets"], 
     "index": "indexcli.html", 
     "main": "main.ts", 
     "test": "test.ts", 
     "tsconfig": "tsconfig.json", 
     "prefix": "", 
     "mobile": false, 
     "styles": [], 
     "scripts": [ 
     ], 
     "environments": { 
     "source": "environments/environment.ts", 
     "dev": "environments/environment.ts", 
     "prod": "environments/environment.prod.ts" 
     } 
    } 
    ], 
    "addons": [], 
    "packages": [], 
    "e2e": { 
    "protractor": { 
     "config": "./protractor.conf.js" 
    } 
    }, 
    "test": { 
    "karma": { 
     "config": "./karma.conf.js" 
    } 
    }, 
    "defaults": { 
    "styleExt": "css", 
    "prefixInterfaces": false, 
    "inline": { 
     "style": true, 
     "template": true 
    }, 
    "spec": { 
     "class": false, 
     "component": true, 
     "directive": true, 
     "module": false, 
     "pipe": true, 
     "service": true 
    } 
    } 
}

所有这些准备之后 - 纳克构建应该工作...

来源

2016-12-23 21:20:58 Igor

你不需要做所有这些事情，只需降级打字稿，因为@ocrifc说他是他的答案。 – vinagreti

只有在角2.4.1他们解决了问题与编译 – Igor

并更好地使用2.4.2哪里一切工作顺利，即使打字稿2.1.4 – Igor

它是关于与打字稿2.1.x的一些重大变化，只是降级到2.0.x的修复现在的问题（直到修复在上游发布）。

来源

2016-12-25 19:52:03 oidualc

Yup： “typescript”：“2.0.x” in package.json中为我解决它。 –

这也解决了我的问题。 – vinagreti

正如另一个答案中提到的那样，目前不支持TypeScript 2.1。

如果您正在使用角CLI，升级您的项目的正确方法如下：

 
npm uninstall --global angular-cli 
npm cache clean 
npm install --global angular-cli 
ng init

这将提供覆盖多个文件。因为无论如何你都应该使用git，所以我们鼓励你让它覆盖angular-cli.json和package.json以及其他框架特定的文件（如果被要求覆盖，则可以使用src/test.ts和src/tsconfig.json等，但是你不需要覆盖app/文件）。

一旦完成，请在git中查看diff并恢复它可能已删除的任何NPM包或脚本。

然后删除node_modules，并运行npm install。

来源

2016-12-27 04:48:14 Meligy

从Angular 2.2.3升级到2.4.0

回答

相关问题