Feature Request: Angular CLI + NativeScript

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.

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

@jeffbcross

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

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.

@NathanWalker

@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.

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

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.

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.

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.

@BRWR

@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.

@BRWR

@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.

@jeffbcross

@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.

@BRWR

@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!

@jkuri

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!

@BRWR

@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

A walk-through of how this integration works with the cli today is here:
https://www.youtube.com/watch?v=T2wAb6UX8zo

It could be even more seamless with a lil' collaboration here 👍

@gelliott181 This is exactly my thinking too. We will have a chat with the CLI team this week and will update this thread.

We are waiting for ng-cli to support Nativescript.

@hansl

We had a quick chat yesterday with @hansl and @Brocco. The Angular CLI team and NativeScript team are starting to work more closely on this integration. Please expect an update on this issue in the next several months (but probably not earlier). The main thing is that we will work together on this and NativeScript will be part of the Angular CLI development workflow soon.

In the interim please use the NativeScript CLI to develop apps using Angular and NativeScript.

I will keep everyone posted once there is more information.

For people who need to integrate Angular CLI and NativeScript project, I've just created a seed project let you use Angular CLI to generate components, directives or modules in NativeScript project.

https://github.com/wellwind/native-script-with-ng-cli

For me it's better than another magic project - nativescript-ngx-magic

because I don't have to change too much code, and project structure is very familiar to Angular CLI project.

I also write a detail steps about how I create this seed project:
https://gist.github.com/wellwind/a3a11c9c3667878c58775793975acd09

It's not perfectly and fully integrated but could be a good start :)

hi, any news?

any news?

You can use the NativeScript schematics now:
https://github.com/NativeScript/nativescript-schematics/blob/master/README.md

If you’re looking for NativeScript with Nx workspaces, you can use:
https://nstudio.io/xplat/

For now, use NativeScript's build support which extends the CLI. We're working together to evolve the two toolchains to a common place.

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.}

Navigation Menu

Repository navigation

Feature Request: Angular CLI + NativeScript #698

15 remaining items

Metadata

Assignees

Labels

Type

Projects

Milestone

Relationships

Development

Feature Request: Angular CLI + NativeScript #698

Description

Activity

jlooper commented on May 10, 2016

NathanWalker commented on May 10, 2016

NathanWalker commented on May 10, 2016

jamesbrewerdev commented on May 10, 2016

NathanWalker commented on May 10, 2016

jamesbrewerdev commented on May 10, 2016

NathanWalker commented on May 10, 2016

jamesbrewerdev commented on May 10, 2016

NathanWalker commented on May 10, 2016

jeffbcross commented on May 10, 2016

jamesbrewerdev commented on May 10, 2016

jeffbcross commented on May 10, 2016

NathanWalker commented on May 10, 2016

NathanWalker commented on May 10, 2016

NathanWalker commented on May 12, 2016

15 remaining items

valentinstoychev commented on Jan 9, 2017

perjerz commented on Jan 10, 2017

valentinstoychev commented on Jan 12, 2017

wellwind commented on Mar 2, 2017

listepo commented on Jul 26, 2017

RainingNight commented on Apr 17, 2018

NathanWalker commented on Apr 17, 2018

alexeagle commented on Jul 31, 2018

angular-automatic-lock-bot commented on Sep 8, 2019

Metadata

Metadata

Assignees

Labels

Type

Projects

Milestone

Relationships

Development

Issue actions