Angular 6 Migration -.angular-cli.json to angular.json

Question

I've upgraded my project to Angular 6, and everything went fine except the conversion of .angular-cli.json file. From the guide I followed, it was said that this will convert it automatically.

npm install -g @angular/cli

npm install @angular/cli

ng update @angular/cli

However, it was not the case as I still have the old .angular-cli.json

Is there a way to do it automatically / manually?

Answer 1

Most likely there were errors in one of those commands. For me, I had to run npm install -g @angular-devkit/core first and then run the commands:

npm install -g @angular/cli

npm install @angular/cli

In the console output of npm install @angular/cli you should see:

================================================================================
The Angular CLI configuration format has been changed, and your existing configuration can
be updated automatically by running the following command:

  ng update @angular/cli
================================================================================

Then you obviously should run ng update @angular/cli to finish off the process.

See the Official Update Guide for additional details.

Answer 2

you can automatically update your existing angular-cli.json file to angular.json file by using the below command provided that you are on v6.x.x or greater of angular cli command line tool.

ng update @angular/cli --from=1.7.4 --to=6 --migrate-only

In the above command 1.7.4 is the previous cli version you were using. The --migrate-only flag makes sure that it will only perform a migration but does not update the installed version. Use --to instead of @angular/cli@6 because of https://github.com/angular/angular-update-guide/issues/64.

read more: angular/cli-github

Answer 3

Try running "ng update @angular/cli" twice it will update angular-cli.json to angular.json

UPDATE:

if getting errors like this:

ERROR: The specified command update is invalid, for available options see ng-help.

then you need to run 2 commands as follows

1. npm install --save-dev @angular/cli@latest.
2. ng update @angular/cli

this will automatically create angular.json, delete .angular-cli.json and update karma.conf.js, src/tsconfig.spec.json, package.json, and tslint.json

Answer 4

I was trying to update from 5.2 -> 6.1 and was running into an issue where after running npm install @angular/cli@6 followed by ng update @angular/cli@6, (as described by https://update.angular.io/#5.2:6.1) my package.json was being updated but none of the other files like .angular-cli.json or tsconfig.json were, even though I received no errors. I tried executing the update command multiple times but this had no effect.

I ended up running the following 3 commands which worked for me:

npm install @angular/cli@6
ng update @angular/cli
ng update @angular/core@6

The only real change there is the second command. The document says to run ng update @angular/cli@6 but that wouldn't update any of the config files.

Answer 5

For upgrading version from 5.2 to 6.0 , I followed up the following steps.

• Install Node 8 or above.
• yarn global add @angular/cli.
• yarn add @angular/cli.
• ng update @angular/cli.

• ng update @angular/core.

  Note: if, after executing ng update @angular/core command,invalid range issue arises,then follow below, just replace the major version in package.json, it'll automatically replace the minor. Resource : Want to upgrade project from Angular v5 to Angular v6

    - npm uninstall -g angular-cli
    - npm cache clean or npm cache verify
    - npm install -g @angular/cli@next
    - then, replace lower versions to higher versions in package.json 
      file.
    - delete node modules folder.
    - run npm/yarn install.
  

After npm install, if you get error of missing src/styles path, then remove the paths given in angular.json file under assets block from ["src/styles", "src/fonts", "src/images", "src/assets", "src/favicon.ico"] to ["assets","favicon.ico"].

• yarn global add rxjs-tslint (might required).
• rxjs-5-to-6-migrate -p src/tsconfig.app.json (might required).
• yarn install @angular/[email protected] (to update material packages).

=> Please note you never need to rename angular.cli.json to angular.json manually!!

** feel free to ask if further queries arises.

Answer 6

Please follow these steps :

1) Update your Angular CLI globally and locally (assuming latest version to be 7)

2) Take your old project and run following command

• npm install @angular/cli
• ng update @angular/cli

After running this you have updated all your angular packages to the latest version.

3)Add this package as it is still missing

npm install @angular-devkit/core --save -dev

4) create a fresh new project with ng serve (latest version)

5) Create a new empty file with name angular.json and copy the content of angular.json from the new project into it.

6) Update the name of project accordingly in angular.json

7) Run npm install

8) Run ng serve

9) You are now ready with the latest version of angular.

I followed the above steps to migrate from angular2 to angular7.

Answer 7

IN CASE OF:
Local workspace file ('angular.json') could not be found.
OR
The serve command requires to be run in an Angular project, but a project definition could not be found.

Upgrade/downgrade to the desired version ( I tried Angular 6 for example )

[sudo] npm install -g -f @angular/[email protected]

Update the local project

ng update @angular/[email protected]

And you're good to go :)

ng serve

Answer 8

I had to actually commit every changes or stash them before I could run the command to update the cli as shown in this screenshot.

I did these commands:

npm install --save-dev @angular/cli@latest 

ng update@angular/cli

And committing the changes between these two.