从 angular 2 升级到 4.0.0-rc1
Upgrading from angular 2 to 4.0.0-rc1
我最近一直在使用 Angular 2,对它比较陌生。
鉴于即将发布,我决定升级到最新版本,这是第一个 Angular 4 发布候选版本。我尝试使用建议的命令:
npm install @angular/{common,compiler,compiler-cli,core,forms,http,platform-browser,platform-browser-dynamic,platform-server,router,animations}@next --save
此命令失败,我从其他帖子了解到此语法在我不熟悉的bash中可用。
我将我的路径设置为我的项目文件夹,然后我尝试使用以下方法单独安装每个包:
npm install @angular/common@next --save
每个包裹。
这似乎部分有效,但给出了一些依赖性警告。
现在的结果是,我无法再使用 ng serve,而且我认为我的设置至少可以说是 损坏。
有人可以建议一种使用节点卸载 angular(全局和本地)的方法,这样我就可以从头开始安装 angular 4 rc1 和最新的 angular cli。
我为此投入了一些时间并使其正常运行(据我所知)。
这是你必须做的(更确切地说,这是我做了几次测试并且它有效)。按顺序执行这些步骤。
照常使用 angular cli 创建项目。
像往常一样,进入那个项目目录。
删除node_modules。
单独安装 webpack(以确保您获得最新版本 ^2)。
npm install webpack
用下面的文件替换你的 package.json 文件,然后 运行 npm install。
运行 服务
项目启动。
请注意,当 运行ning 服务时,您将看到 20 多个这样的错误。他们似乎没有阻止项目 运行ning,而且我在浏览器控制台中没有看到任何错误。
[default] /Users/tcoz/web-dev-projects/angular4/node_modules/@angular/platform-browser/typings/src/dom/dom_renderer.d.ts:58:41
Initializers are not allowed in ambient contexts.
另一件事:我没有全局安装 TS。不确定这是否重要,但它可能。确保你是 运行ning 最新版本 (^2.2.1)。
package.json(注意更新了很多东西,不仅仅是 angular,在我刚安装 webpack 2 之前,一些依赖信息令人困惑):
{
"name": "angular4",
"version": "0.0.0",
"license": "MIT",
"angular-cli": {},
"scripts": {
"start": "ng serve",
"lint": "tslint \"src/**/*.ts\"",
"test": "ng test",
"pree2e": "webdriver-manager update",
"e2e": "protractor"
},
"private": true,
"dependencies": {
"@angular/compiler": "4.0.0-rc.1",
"@angular/core": "4.0.0-rc.1",
"@angular/common": "4.0.0-rc.1",
"@angular/forms": "4.0.0-rc.1",
"@angular/http": "4.0.0-rc.1",
"@angular/platform-browser": "4.0.0-rc.1",
"@angular/platform-browser-dynamic": "4.0.0-rc.1",
"@angular/router": "4.0.0-rc.1",
"core-js": "^2.4.1",
"rxjs": "^5.0.1",
"ts-helpers": "^1.1.1",
"zone.js": "^0.7.2"
},
"devDependencies": {
"@angular/compiler-cli": "4.0.0-rc.1",
"@types/jasmine": "2.5.38",
"@types/node": "^6.0.42",
"angular-cli": "1.0.0-beta.21",
"codelyzer": "3.0.0-beta.0",
"jasmine-core": "2.5.2",
"jasmine-spec-reporter": "2.5.0",
"karma": "1.2.0",
"karma-chrome-launcher": "^2.0.0",
"karma-cli": "^1.0.1",
"karma-jasmine": "^1.0.2",
"karma-remap-istanbul": "^0.2.1",
"protractor": "4.0.9",
"ts-node": "1.2.1",
"tslint": "^4.0.0",
"typescript": "^2.2.1",
"webdriver-manager": "10.2.5"
}
}
在 package.json 中,我用当前的新版本 (4.0.0-rc.3) 替换了 angular 组件 (2.4.9) 的版本号,并且还指定了 @ angular/router 到 4.0.0-rc.3。除了来自某些 kendo 组件的警告外,构建进展顺利。尽管有警告,kendo 组件仍按预期运行。
我最近一直在使用 Angular 2,对它比较陌生。
鉴于即将发布,我决定升级到最新版本,这是第一个 Angular 4 发布候选版本。我尝试使用建议的命令:
npm install @angular/{common,compiler,compiler-cli,core,forms,http,platform-browser,platform-browser-dynamic,platform-server,router,animations}@next --save
此命令失败,我从其他帖子了解到此语法在我不熟悉的bash中可用。
我将我的路径设置为我的项目文件夹,然后我尝试使用以下方法单独安装每个包:
npm install @angular/common@next --save
每个包裹。 这似乎部分有效,但给出了一些依赖性警告。
现在的结果是,我无法再使用 ng serve,而且我认为我的设置至少可以说是 损坏。 有人可以建议一种使用节点卸载 angular(全局和本地)的方法,这样我就可以从头开始安装 angular 4 rc1 和最新的 angular cli。
我为此投入了一些时间并使其正常运行(据我所知)。
这是你必须做的(更确切地说,这是我做了几次测试并且它有效)。按顺序执行这些步骤。
照常使用 angular cli 创建项目。
像往常一样,进入那个项目目录。
删除node_modules。
单独安装 webpack(以确保您获得最新版本 ^2)。
npm install webpack
用下面的文件替换你的 package.json 文件,然后 运行 npm install。
运行 服务
项目启动。
请注意,当 运行ning 服务时,您将看到 20 多个这样的错误。他们似乎没有阻止项目 运行ning,而且我在浏览器控制台中没有看到任何错误。
[default] /Users/tcoz/web-dev-projects/angular4/node_modules/@angular/platform-browser/typings/src/dom/dom_renderer.d.ts:58:41
Initializers are not allowed in ambient contexts.
另一件事:我没有全局安装 TS。不确定这是否重要,但它可能。确保你是 运行ning 最新版本 (^2.2.1)。
package.json(注意更新了很多东西,不仅仅是 angular,在我刚安装 webpack 2 之前,一些依赖信息令人困惑):
{
"name": "angular4",
"version": "0.0.0",
"license": "MIT",
"angular-cli": {},
"scripts": {
"start": "ng serve",
"lint": "tslint \"src/**/*.ts\"",
"test": "ng test",
"pree2e": "webdriver-manager update",
"e2e": "protractor"
},
"private": true,
"dependencies": {
"@angular/compiler": "4.0.0-rc.1",
"@angular/core": "4.0.0-rc.1",
"@angular/common": "4.0.0-rc.1",
"@angular/forms": "4.0.0-rc.1",
"@angular/http": "4.0.0-rc.1",
"@angular/platform-browser": "4.0.0-rc.1",
"@angular/platform-browser-dynamic": "4.0.0-rc.1",
"@angular/router": "4.0.0-rc.1",
"core-js": "^2.4.1",
"rxjs": "^5.0.1",
"ts-helpers": "^1.1.1",
"zone.js": "^0.7.2"
},
"devDependencies": {
"@angular/compiler-cli": "4.0.0-rc.1",
"@types/jasmine": "2.5.38",
"@types/node": "^6.0.42",
"angular-cli": "1.0.0-beta.21",
"codelyzer": "3.0.0-beta.0",
"jasmine-core": "2.5.2",
"jasmine-spec-reporter": "2.5.0",
"karma": "1.2.0",
"karma-chrome-launcher": "^2.0.0",
"karma-cli": "^1.0.1",
"karma-jasmine": "^1.0.2",
"karma-remap-istanbul": "^0.2.1",
"protractor": "4.0.9",
"ts-node": "1.2.1",
"tslint": "^4.0.0",
"typescript": "^2.2.1",
"webdriver-manager": "10.2.5"
}
}
在 package.json 中,我用当前的新版本 (4.0.0-rc.3) 替换了 angular 组件 (2.4.9) 的版本号,并且还指定了 @ angular/router 到 4.0.0-rc.3。除了来自某些 kendo 组件的警告外,构建进展顺利。尽管有警告,kendo 组件仍按预期运行。