Feature Request: Angular CLI + NativeScript

[jamesbrewerdev]

Feature Request: Built-in support for NativeScript

With the announcement of both Angular CLI and NativeScript's support for Angular 2, I tried to create a new project with Angular CLI that supports NativeScript. I did not have much luck getting things running. Given that both projects are relatively new, I couldn't find any resources on how to make them work together.

Can we add a flag to the CLI that would include NativeScript as part of the new project? I would image something like this:

ng new PROJECT_NAME --nativescript

From what I can see, running ng new runs the new command which creates a new directory and then runs the init command inside the directory. init appears to accept a command line argument blueprint that could help here. Is it possible to add NativeScript support simply by creating a blueprint that includes NativeScript? If so, the above command could be ng new PROJECT_NAME --blueprint=nativescript.

I'm happy to create a PR for this if the community agrees that it's a good idea.

[jlooper]

I'm referencing a thread on the NativeScript side; this is a work in progress :) NativeScript/nativescript-angular#225

[NathanWalker]

I wanted to chat with @jeffbcross at ngConf about this regarding the mobile-toolkit, tracked here: angular/mobile-toolkit#23

[NathanWalker]

Dropping a NativeScript app into a new angular-cli project and sharing all your web code is possible today with nativescript-ng2-magic - angular-cli specific steps outlined here: NativeScript/nativescript-angular#225 (comment)

We could create even tighter integration if we could work together with the mobile-toolkit team.

[jamesbrewerdev]

@NathanWalker I'm wondering if we can't have Angular CLI support all of these things (NativeScript, React Native, Universal, etc) by default.

Angular CLI is based on Ember CLI which has an awesome plugin system. The plugin system supports the concept of "blueprints", which I think is what we're looking for. See angular-CLI/addons/ng2/blueprints (can't link because I'm on mobile).

The one issue I foresee is if two blueprints touch the same file. Merge conflicts would need to be handled some how.

[NathanWalker]

Agreed, angular-cli integration makes a lot of sense not just for NativeScript, but all the options. You can track this issue: angular/mobile-toolkit#23

[jamesbrewerdev]

Thanks! Out of curiosity, why should this be part of the mobile-toolkit repo and not part of the angular-CLI repo? I'm not 100% clear on what mobile-toolkit is for.

[NathanWalker]

The mobile toolkit is aimed at providing progressive web app capabilities specifically for vastly improved mobile experiences. Watch Jeff and Alex's presentation from ngConf last week:
https://www.youtube.com/watch?v=wLWVASD0dvU

To me, mobile-toolkit implies a toolkit for all things awesome in the mobile arena. From my perspective, that repo provides the tools to work with progressive web apps at the moment. However hence the name, it would make a great place to expand to provide all things awesome for mobile and Angular.

IMO, It wouldn't make sense as part of the core of angular-cli since it truly is very mobile centric, which is what the mobile-toolkit helps complement the cli with.

[jamesbrewerdev]

In general, I agree with you. My personal concern with having a separate repository for mobile-toolkit is that mobile inherently becomes second-class. If we want mobile to be first class, which I think we all do, then it's my perspective that we should support everything mobile right out of the box.

[NathanWalker]

@BRWR The decision to have a mobile-toolkit repo and Mobile Team is one made by the angular core team of which I agree with. It's not to say that it doesn't make mobile a first class citizen, but rather from my perspective, a clean separation of concerns. It all feeds back into the cli so not sure I understand your concern.

[jeffbcross]

@BRWR I'm in the process of working with @hansl to bake a lot of the mobile-toolkit stuff directly into the CLI behind the --mobile flag. But eventually, when CLI has more of a plugin or addon story, the mobile toolkit should move back out of CLI.

@NathanWalker we're focusing mobile toolkit on pure Web apps at the moment, so we can focus all our efforts on making PWA excellent. I agree, the name is ambiguous about the scope of the project. It was previously angular/progressive, but we changed the name since the toolkit's roadmap isn't completely within the scope of Progressive Web Apps.

[jamesbrewerdev]

@jeffbcross That's awesome to hear! Is there anything I can help with? I know the repo says the project is still too early to accept major user contributions, but I thought I'd offer anyways.

[jeffbcross]

@BRWR we're in a push to get a few things in order to present Angular and Progressive Web Apps at Google I/O next Wednesday, but I plan to outline more of a roadmap and Github issues after that. I'll make a note to ping you!

[NathanWalker]

To carry over some thoughts, I would propose the possibility of a --native flag in addition to --mobile flag (already possible via mobile-toolkit) which could generate a NativeScript shell (or even ReactNative, whichever user prefers). I could certainly help provide a PR over next 2 weeks which would essentially do following (I could work with @jkuri on this):

$ ng new hello-mobile --mobile --native
$ cd hello-mobile

Then run the app:

$ ng run ios

or...

ng run android

There's a lot of nice things that could be done here with regards to this but that'd be my first base run.
If multiple native runtimes were supported we could provide something like this:

$ ng new hello-mobile --mobile --nativescript
...or...
$ ng new hello-mobile --mobile --reactnative

Good luck at Google I/O @jeffbcross, all exciting stuff, nice work!

[NathanWalker]

@BRWR if you want to hop in this slack channel and ping me, we can discuss more. We can certainly work together on this to make it as nice as possible. https://t.co/uExEluDrmO

You can ping me there with @walkerrunpdx