wwwalkerrun / nativescript-ngx-magic

Magically drop a NativeScript app into your Angular web app and reuse all your code.
MIT License
48 stars 8 forks source link

Creating new component #5

Closed vforv closed 7 years ago

vforv commented 7 years ago

After I install ngx magic how then I generate new component and put it inside other component? Also why after I generate component it create it just in nativscript folder is that normal behaviour? whit this: ng g component testcnew

And after I finish app how can I build it and upload to phone?

NathanWalker commented 7 years ago

Hi @vforv, to generate a new component, ensure you run the command from the root of the project (not from nativescript folder):

root-of-project$: ng g component testcnew

That will create src/app/testcnew/testcnew.component.ts (and friends). You will then need to modify the new component per the guide here. For example: Before:

import { Component, OnInit } from '@angular/core';

@Component({
  selector: 'app-testcnew',
  templateUrl: './testcnew.component.html',
  styleUrls: ['./testcnew.component.css']
})

After:

import { Component } from '@wwwalkerrun/nativescript-ngx-magic';
import { OnInit } from '@angular/core';

@Component({
  moduleId: module.id,
  selector: 'app-testcnew',
  templateUrl: 'testcnew.component.html',
  styleUrls: ['testcnew.component.css']
})

Then you are free to add your new component anywhere else, for example, you could add it to app.component.html:

<h1>
  {{title}}
</h1>
<app-testcnew></app-testcnew>

And the same thing for your NativeScript (.tns.html) files, for example:

<StackLayout>
  <app-testcnew></app-testcnew>
</StackLayout>

As far as when you finishing building app and then want to deploy to app stores, see these guides:

vforv commented 7 years ago

It works for new component even you don't need to change pathes... I just added this: moduleId: module.id

But there is one problem when I generate new component it not show automaticly in root/app folder I need to restart editor, I am using netbeans.

I like pkg, GJ!!!

Also I have some suggestions to imporve pkg:

-Add some help in terminal to display all options -Remove unessesery files from nativescript/app folder -After component is created automaticly update module inside nativescipt folder and add this moduleId: module.id in decorator of component.