Use SPFx with Angular and Angular CLI

Yes, you can use SPFx with Angular and Angular CLI — without waiting for Angular Elements. Although when Angular elements comes around, this should easily work with that too.

Like many of you, I have been anxiously waiting for an official Angular + SPFx story.

(Skip reading and see this as a video?)

What about Angular Elements

I had earlier blogged about an exciting new project coming up in Angular 6 called “Angular Elements”. I love Angular Elements, and I think it will add loads of value. Not just to SPFx but in general.

However, it is not required for SPFx. Yes you read that right, you can write a fully supportable Angular webpart in SPFx with AOT and every other Angular advantage, without using Angular Elements.

Angular elements will simply make it a lot easier to redistribute the code if you are a third party vendor, and Angular elements will offer a way to surface existing Angular apps, so existing apps should easily upgrade to Angular Elements.

SPFx Yeoman generator

I had also earlier blogged about some thoughts on the current state of Angular and SPFx. My main take away there for SPFx was, I am not a fan of the yeoman template based approach for many reasons.

1. It is designed for a quick “hello world”, real world projects will most likely use the yeoman template once in their lifetime — when you create the project and that’s it.
2. It ties you to specific, usually older versions of frameworks
3. It makes you pick between two frameworks — React or Knockout, and that too older versions of those.
4. As you take on further dependencies, the yeoman generator does not help you there
5. Even a new version of SPFx for even a simple hello world webpart, will require hand-edits.