0

I have to update a Angular 2 app with SystemJS to the latest version of Angular, currently Angular 7. It also lacks the Angular CLI and I would like to add it to the project, so there are two big changes.

I have read this: https://update.angular.io/ But there's nothing about SystemJS in there.

Also read this, but it's only about SystemJS: Move project from SystemJS to Angular CLI / Webpack

So, which is the best order to accomplish this task? Start a Angular7 project from scratch with AngularCLI and paste files and fix things? Go step by step upgrading angular and then change SystemJS to AngularCLI? First change SystemJS to AngularCLI and then upgrade Angular version?

Thank you.

Sergio Tx
  • 3,706
  • 1
  • 16
  • 29
  • [https://update.angular.io/](https://update.angular.io/) – Harun Yilmaz Jan 11 '19 at 11:53
  • Already seen that. It doesn't help at all with SystemJS. – Sergio Tx Jan 11 '19 at 11:55
  • SystemJS is just a way to serve your files and map them between your client and your server. Angular-CLI takes care of this taks with the bundling. Just add Angular-CLI, and follow the steps to upgrade. This is why you should have upgraded a long time ago progressively and not from v2 to v7 : your experience will be painful. – Alex Beugnet Jan 11 '19 at 12:33

1 Answers1

1

From angular 2 to angular 7, things change a lot. I think the best way should be:

  • Install angular-cli, and learn the command ng ;
  • Create a default project with ng new and with other parameters like --styles scss (if you use scss), --routing true (if you use routing), and ther parameters, depends on what your old project use.
  • Compair the project you created, and your old project, directory structure changed a lot, you should know which folder is for source code, which folder is for unit test, and which folder is for e2e test;
  • Delete all the source code (*.ts, *.html, *.scss or *.css) in the src/app folder of the project created by ng command;
  • Copy the code of your old project to the correspond folder of your new project;
  • Install the npm packages of your old projects;
  • Try build your projects with ng build, and fix any erros;
  • Then build your project with ng build --prod, and fix any errors again;
  • If you can build your project, try ng serve to serve it, and navigate to http://127.0.0.1:4200 with your browser, see what happens.

Upgrade from angular 2 to angular 7 may be a big challenge, and good luck!

zhimin
  • 2,740
  • 12
  • 22
  • Thank you! So create a new project with angular CLI and start copying the old project in the new structure and fixing bugs. :) – Sergio Tx Jan 14 '19 at 11:49