Angular-cli: Update to Angular 4??

[tx8821]

When could we expect the CLI to be updated to generate project with Angular version 4?
Meanwhile if we manually change the version in "package.json" to v4, what issues should we expect?
I mean, what are the things (if any) in version 4 that is not yet compatible to the CLI?

[gelliott181]

The CLI trails the current NPM release (2.4), usually by a week.

You can update, but you'll need to check the release notes to find out what breaking changes required a Semver major update.

[Codenator81]

@tx8821 I installed angular 4.0.0-beta.3 without issues for now

[zsfarkas]

I think, angular-cli should support the latest stable version of angular, by default. On demand, anybody can manually upgrade to version 4.

[filipesilva]

We plan on being Angular 4 compatible as soon as it's out. We overall also tests our code against the latest preview versions on angular/angular to make sure it's compatible and try to keep it working for both current and upcoming versions.

I don't think it's a good idea to force people to use the Angular 4 beta by default though.

[thekalinga]

@Codenator81 I'm getting following issue after upgrading angular manually to 4.0.0-beta.3

yarn install v0.18.1
[1/4] Resolving packages...
[2/4] Fetching packages...
warning [email protected]: The platform "linux" is incompatible with this module.
info "[email protected]" is an optional dependency and failed compatibility check. Excluding it from installation.
[3/4] Linking dependencies...
warning Incorrect peer dependency "@angular/compiler@<=2.4 >=2.2.0".
warning Incorrect peer dependency "@angular/core@<=2.4 >=2.2.0".
warning Unmet peer dependency "@angular/tsc-wrapped@^0.5.0".
warning Unmet peer dependency "reflect-metadata@^0.1.8".
[4/4] Building fresh packages...
Done in 8.18s.

Here is my package.json

{
  "name": "staff-ui",
  "version": "1.0.0",
  "license": "MIT",
  "angular-cli": {},
  "scripts": {
    "ng": "ng",
    "start": "ng serve",
    "lint": "tslint \"src/**/*.ts\" --project src/tsconfig.json --type-check && tslint \"e2e/**/*.ts\" --project e2e/tsconfig.json --type-check",
    "test": "ng test",
    "pree2e": "webdriver-manager update --standalone false --gecko false",
    "e2e": "protractor"
  },
  "private": true,
  "dependencies": {
    "@angular/common": "^4.0.0-beta.3",
    "@angular/compiler": "^4.0.0-beta.3",
    "@angular/core": "^4.0.0-beta.3",
    "@angular/forms": "^4.0.0-beta.3",
    "@angular/http": "^4.0.0-beta.3",
    "@angular/platform-browser": "^4.0.0-beta.3",
    "@angular/platform-browser-dynamic": "^4.0.0-beta.3",
    "@angular/router": "^4.0.0-beta.3",
    "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-beta.3",
    "@types/jasmine": "2.5.38",
    "@types/node": "^6.0.42",
    "angular-cli": "1.0.0-beta.25.5",
    "codelyzer": "~2.0.0-beta.1",
    "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.13",
    "ts-node": "1.2.1",
    "tslint": "^4.3.0",
    "typescript": "~2.0.3"
  }
}

Any idea what might be causing this?

[Codenator81]

@thekalinga It is just warnings not errors. Just ignore them

[thekalinga]

@Codenator81 ng serve is not loading the default screen in browser.

[thekalinga]

@Codenator81 Please ignore my previous comment. The reason ng serve was not working is due to the fact that my app prefix started with a number. Looks like angular does not like the prefixes that start with a number

i.e I have used my app prefix as 1ton & angular was not accepting it properly.

Now I changed it to ton & its working

BTW, I'm not sure what these warnings might break later on

warning Incorrect peer dependency "@angular/compiler@<=2.4 >=2.2.0".
warning Incorrect peer dependency "@angular/core@<=2.4 >=2.2.0".
warning Unmet peer dependency "@angular/tsc-wrapped@^0.5.0".
warning Unmet peer dependency "reflect-metadata@^0.1.8".

[Codenator81]

@thekalinga From my long programming practice I learn newer name file names and classes (every thing) starting from anything but ABC character.
I have the same warning. It is just warning about peer dependency.

[thekalinga]

The product name 1ton that I am developing starts with a number :)

[beeman]

@thekalinga in code it probably makes sense to refer to it as oneton or one-ton then. :)

[Codenator81]

@thekalinga In your case I name app OneTonn

[thekalinga]

@beeman Agreed, just wanted to save some key strokes, as this would need to be repeated throughout the templates :)

[thucnguyen77]

Hi,

I was able to update my sample Angular CLI app to 4.0.0 using the guideline at http://angularjs.blogspot.com.au/2017/03/angular-400-now-available.html, and it worked. However I got following "invalid" errors. Should it be any real issue with the app at run time?

+-- @angular/[email protected]
+-- @angular/[email protected]
| `-- [email protected]
+-- @angular/[email protected]
+-- @angular/[email protected]
+-- @angular/[email protected]  invalid
+-- @angular/[email protected]
+-- @angular/[email protected]
+-- @angular/[email protected]
+-- @angular/[email protected]
+-- @angular/[email protected]
+-- @angular/[email protected]
| +-- [email protected]
| `-- [email protected]
+-- @angular/[email protected]
+-- [email protected]  invalid
`-- UNMET PEER DEPENDENCY [email protected]

[filipesilva]

@thucnguyen77 you need to update zone.js to ^0.8.4 as well.

[ramanroy911]

I have the same error

[megalucio]

So, yeah, now that angular 4 is out, shouldn't angular-cli use it by default as indicated above instead of having to update? That does not seem to be the case...

[matusbielik]

@megalucio I have just created new project with latest angular-cli (1.0.0) and it uses Angular 4.

package.json:

"dependencies": {
    "@angular/common": "^4.0.0",
    "@angular/compiler": "^4.0.0",
    "@angular/core": "^4.0.0",
    "@angular/forms": "^4.0.0",
    "@angular/http": "^4.0.0",
    "@angular/platform-browser": "^4.0.0",
    "@angular/platform-browser-dynamic": "^4.0.0",
    "@angular/router": "^4.0.0",
    "core-js": "^2.4.1",
    "rxjs": "^5.1.0",
    "zone.js": "^0.8.4"
  },

[megalucio]

Thanks, yeah I did not have updated my angular-cli properly. Now it is working.

[angular-automatic-lock-bot[bot]]

This issue has been automatically locked due to inactivity.
Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

_{_This action has been performed automatically by a bot._}