NativeScript / nativescript-schematics

nativescript, mobile, schematics, angular
Apache License 2.0
186 stars 26 forks source link

ns preview - PLAYGROUND RELATED ONLY - Type AppRoutingModule does not have 'ngModuleDef' property. #290

Open betosalvador opened 3 years ago

betosalvador commented 3 years ago

Environment Provide the content of the package.json file in the project:

{ "name": "workspace2", "nativescript": { "id": "org.nativescript.workspace2", "tns-android": { "version": "6.5.3" } }, "version": "0.0.0", "scripts": { "ng": "ng", "start": "ng serve", "build": "ng build", "test": "ng test", "lint": "ng lint", "e2e": "ng e2e", "android": "tns run android --no-hmr", "ios": "tns run ios --no-hmr", "mobile": "tns run", "preview": "tns preview", "ngcc": "ngcc --properties es2015 module main --first-only", "postinstall": "npm run ngcc" }, "private": true, "dependencies": { "@angular/animations": "~10.0.0", "@angular/common": "~10.0.0", "@angular/compiler": "~10.0.0", "@angular/core": "~10.0.0", "@angular/forms": "~10.0.0", "@angular/platform-browser": "~10.0.0", "@angular/platform-browser-dynamic": "~10.0.0", "@angular/router": "~10.0.0", "core-js": "^2.6.9", "@nativescript/angular": "~10.0.0", "@nativescript/core": "rc", "@nativescript/theme": "~2.2.1", "reflect-metadata": "~0.1.12", "rxjs": "~6.5.5", "tslib": "1.10.0", "zone.js": "~0.10.2" }, "devDependencies": { "@angular/cli": "~10.0.0", "@angular/compiler-cli": "~10.0.0", "@angular-devkit/build-angular": "~0.1000.2", "@nativescript/tslint-rules": "~0.0.5", "@types/jasmine": "~3.5.0", "@types/jasminewd2": "~2.0.3", "@types/node": "^12.11.1", "codelyzer": "^5.1.2", "jasmine-core": "~3.5.0", "jasmine-spec-reporter": "~4.2.1", "karma": "~4.4.1", "karma-chrome-launcher": "~3.1.0", "karma-coverage-istanbul-reporter": "~2.1.0", "karma-jasmine": "~3.0.1", "karma-jasmine-html-reporter": "^1.4.2", "@nativescript/webpack": "~2.0.0", "protractor": "~5.4.3", "ts-node": "~8.3.0", "tslint": "~6.1.0", "typescript": "~3.9.0", "node-sass": "^4.7.1" } }

Describe the bug The error occurs after I run tns preview (or npm run preview) and scan the QR CODE.

Bellow is the error log Copying template files... Platform android successfully added. v6.5.3 Preparing project... File change detected. Starting incremental webpack compilation...

webpack is watching the files…

Hash: b23597466ab3e940e588 Version: webpack 4.43.0 Time: 6268ms Built at: 08/01/2020 11:49:01 AM Asset Size Chunks Chunk Names bundle.js 26.5 KiB bundle [emitted] bundle package.json 112 bytes [emitted] runtime.js 77.1 KiB runtime [emitted] runtime tns-java-classes.js 0 bytes [emitted] vendor.js 345 KiB vendor [emitted] vendor Entrypoint bundle = runtime.js vendor.js bundle.js [./app.css] 1.02 KiB {bundle} [built] [./app/app-routing.module.tns.ts] 1.02 KiB {bundle} [built] [./app/app.component.ts] 905 bytes {bundle} [built] [./app/app.module.tns.ts] 1.56 KiB {bundle} [built] [./app/app.routes.ts] 245 bytes {bundle} [built] [./app/home/home.component.ts] 1.28 KiB {bundle} [built] [./main.tns.ts] 2.3 KiB {bundle} [built] [@angular/core] external "@angular/core" 42 bytes {bundle} [built] [@nativescript/angular] external "@nativescript/angular" 42 bytes {bundle} [built] [@nativescript/core] external "@nativescript/core" 42 bytes {bundle} [built] [@nativescript/core/bundle-entry-points] external "@nativescript/core/bundle-entry-points" 42 bytes {bundle} [built] [@nativescript/core/ui/frame] external "@nativescript/core/ui/frame" 42 bytes {bundle} [built] [@nativescript/core/ui/frame/activity] external "@nativescript/core/ui/frame/activity" 42 bytes {bundle} [built] [@nativescript/core/ui/styling/style-scope] external "@nativescript/core/ui/styling/style-scope" 42 bytes {bundle} [built]

StackTrace: ZoneAwareError(file:///data/data/org.nativescript.preview/files/app/tns_modules/@nativescript/angular/zone-js/dist/zone-nativescript.js:1298:33) at getNgModuleDef(file:///data/data/org.nativescript.preview/files/app/tns_modules/@angular/core/bundles/core.umd.js:1682:19) at (file:///data/data/org.nativescript.preview/files/app/tns_modules/@angular/core/bundles/core.umd.js:1513:31) at noSideEffects(file:///data/data/org.nativescript.preview/files/app/tns_modules/@angular/core/bundles/core.umd.js:1321:19) at ����setNgModuleScope(file:///data/data/org.nativescript.preview/files/app/tns_modules/@angular/core/bundles/core.umd.js:1512:16) at (file:///data/data/org.nativescript.preview/files/app/bundle.js:42:131) at ./app/app-routing.module.tns.ts(file:///data/data/org.nativescript.preview/files/app/bundle.js:42:339) at webpack_require(file:///data/data/org.nativescript.preview/files/app/runtime.js:817:30) at fn(file:///data/data/org.nativescript.preview/files/app/runtime.js:121:20) at ./app/app.module.tns.ts(file:///data/data/org.nativescript.preview/files/app/bundle.js:97:85) at webpack_require(file:///data/data/org.nativescript.preview/files/app/runtime.js:817:30) at fn(file:///data/data/org.nativescript.preview/files/app/runtime.js:121:20) at (file:///data/data/org.nativescript.preview/files/app/bundle.js:211:77) at ./main.tns.ts(file:///data/data/org.nativescript.preview/files/app/bundle.js:276:30) at __webpack_require__(file:///data/data/org.nativescript.preview/files/app/runtime.js:817:30) at checkDeferredModules(file:///data/data/org.nativescript.preview/files/app/runtime.js:44:23) at webpackJsonpCallback(file:///data/data/org.nativescript.preview/files/app/runtime.js:31:19) at (file:///data/data/org.nativescript.preview/files/app/bundle.js:2:57) at require(:1:266)

Error: Type AppRoutingModule does not have 'ngModuleDef' property. at com.tns.Runtime.runModule(Native Method) at com.tns.Runtime.runModule(Runtime.java:674) at com.tns.Runtime.run(Runtime.java:666) at com.tns.NativeScriptApplication.onCreate(NativeScriptApplication.java:21) at android.app.Instrumentation.callApplicationOnCreate(Instrumentation.java:1025) at android.app.ActivityThread.handleBindApplication(ActivityThread.java:5448) at android.app.ActivityThread.-wrap2(ActivityThread.java) at android.app.ActivityThread$H.handleMessage(ActivityThread.java:1564) at android.os.Handler.dispatchMessage(Handler.java:102) at android.os.Looper.loop(Looper.java:154) at android.app.ActivityThread.main(ActivityThread.java:6186) at java.lang.reflect.Method.invoke(Native Method) at com.android.internal.os.ZygoteInit$MethodAndArgsCaller.run(ZygoteInit.java:889) at com.android.internal.os.ZygoteInit.main(ZygoteInit.java:779)

To Reproduce generate a new shared project: ng new -c=@nativescript/schematics workspace --shared enter the project folder: cd workspace run any these commands: tns preview, npm run preview (with or without --no-hmr flag)

Expected behavior Run the project on the real device (preview)

NathanWalker commented 3 years ago

@betosalvador preview needs app store updates which we're working on to bring Angular 10 support to the {N} Preview app. We'll ping back once latest updates have been approved and live on the store.

In meantime you can just use nsc debug android --no-hmr or nsc debug ios --no-hmr

betosalvador commented 3 years ago

@NathanWalker

nice man, thanks

Matheus-Ribeiro95 commented 3 years ago

@NathanWalker any update about this? Angular is amazing for code sharin between web and native btw :D

armache commented 3 years ago

Having the same issue and waiting for the update...

rob4226 commented 3 years ago

@betosalvador preview needs app store updates which we're working on to bring Angular 10 support to the {N} Preview app. We'll ping back once latest updates have been approved and live on the store.

In meantime you can just use nsc debug android --no-hmr or nsc debug ios --no-hmr

@NathanWalker I just tried nsc debug ios --no-hmr and got an error: Applications for platform iOS can not be built on this OS

So what does this mean? It's not possible to preview iOS with NativeScript/Angular 10.0 on Windows right now because the {N} Preview app needs to be updated in the app store? I don't have a mac and don't have an android phone, so I really need to use the ios preview app because my app uses the camera.

It seems like this has been an issue for few months now, what should people do? Thank you!

tulipandmills commented 3 years ago

@betosalvador preview needs app store updates which we're working on to bring Angular 10 support to the {N} Preview app. We'll ping back once latest updates have been approved and live on the store.

In meantime you can just use nsc debug android --no-hmr or nsc debug ios --no-hmr

Is there any news on this? For working with Preview, does it still make sense to wait for this? Is this proposed fix still in the pipeline?

HasikaDilshani commented 3 years ago

I am having same issue.. Is this fixed or not yet?

hinalt commented 3 years ago

I am facing the same issue. My package.json is as follows: { "name": "@nativescript/template-blank-ng", "main": "main.js", "displayName": "Blank", "templateType": "App template", "version": "7.0.6", "description": "NativeScript Application", "author": "NativeScript Team oss@nativescript.org", "license": "SEE LICENSE IN ", "publishConfig": { "access": "public" }, "keywords": [ "nstudio", "nativescript", "mobile", "angular", "{N}", "tns", "template", "category-general" ], "repository": "", "homepage": "https://github.com/NativeScript/nativescript-app-templates", "bugs": { "url": "https://github.com/NativeScript/NativeScript/issues" }, "dependencies": { "@angular/animations": "~10.1.0", "@angular/common": "~10.1.0", "@angular/compiler": "~10.1.0", "@angular/core": "~10.1.0", "@angular/forms": "~10.1.0", "@angular/platform-browser": "~10.1.0", "@angular/platform-browser-dynamic": "~10.1.0", "@angular/router": "~10.1.0", "@nativescript/angular": "~10.1.0", "@nativescript/core": "~7.0.0", "@nativescript/theme": "~3.0.0", "reflect-metadata": "~0.1.12", "rxjs": "^6.6.0", "zone.js": "~0.11.1" }, "devDependencies": { "@angular/compiler-cli": "~10.1.0", "@nativescript/android": "7.0.1", "@nativescript/webpack": "~3.0.0", "@ngtools/webpack": "~10.1.0", "typescript": "~4.0.0" }, "private": "true", "readme": "NativeScript Application" }

Dasone commented 3 years ago

Angular 11 is in it's pre release state and there's still no solution for this problem with NS preview app that generates for everyone who starts with NS coding with later Angular version. How long do we have to wait before this is fixed?

BobbyTable commented 3 years ago

Trying out nativescript, met with this error from a fresh angular project - what exactly am i supposed to do to take this development experiece for a testrun?

jcadiba commented 3 years ago

@BobbyTable Run nsc debug android --no-hmr instead of nsc preview it should work on local connected devices, or AVD

giridhargarimella commented 3 years ago

@BobbyTable Run nsc debug android --no-hmr instead of nsc preview it should work on local connected devices, or AVD

No, it is not working for me... any other clue guys?

AGS-hcole commented 3 years ago

Hi @NathanWalker , I know it has been asked several times but I'm currently starting a new app development and I would be so grateful to have the Angular 10+ fixed with the Playground app Preview so we can go forward using NativeScript Angular. Would it be possible for your to give us a timeline on when we could have this issue fixed ? Kind regards,

michDostal commented 3 years ago

Hi @NathanWalker, as mentioned above this issue has been asked several times, but this bug is reported since August and even after 4 months we don't have solution or atleast some kind of way around. It would be nice if You could atleast provide some status update. Right now I am in bad situation. I need to update to angular 10 because one of our internal package is build on it and I need to use it in nativescript project but I cannot do it because of this bug.

Thank you for reply.

HashtagAssist commented 3 years ago

Thats so sad. I need it too

giridhargarimella commented 3 years ago

Hi @NathanWalker, as mentioned above this issue has been asked several times, but this bug is reported since August and even after 4 months we don't have solution or atleast some kind of way around. It would be nice if You could atleast provide some status update. Right now I am in bad situation. I need to update to angular 10 because one of our internal package is build on it and I need to use it in nativescript project but I cannot do it because of this bug.

Thank you for reply.

I have tried so many other options and finally moved to react native as I have not seen any proper attention on the issue.

kingjordan commented 3 years ago

trying to migrate an existing angular app to new shared code nativescript project so cannot downgrade angular app to use this feature. Is there anyone from telerik who can at least let us know if this will be addressed or if there is another way to accomplish this. People starting new projects can not follow the docs on your site to get this working. That is what I did and ended up here.

darielbarroso commented 3 years ago

Same, I had to download an early version of tns in order to make it work. Ended up installing version 6.4.1 and from there I was able to run it

lano-vargas commented 3 years ago

Currently trying out this out and have came across this issue. is there a way around it on have to downgrade version is the only solution? Thanks

lano-vargas commented 3 years ago

I've ended up using a skeleton from https://play.nativescript.org/ downloaded then cd to MyprojectFolder and tns preview But then stumble upon this issue https://github.com/NativeScript/playground-feedback/issues/190 and the versioning changes mentioned there works for me.

Yakhnitsa commented 3 years ago

I got the same error, I am just started new project using ng new --collection=@nativescript/schematics test-project --shared, fix some errors in polyfills.ts and tsconfig.json with the help of stackowerflow and github, but this error is not solved for me. I did nothing but starting new project... now I will think twice before using nativescript for future projects, If I got throubles at the start of my project what will it be in future.

svipandi commented 3 years ago

@NathanWalker Is there any timeline to fix this issue so that I can plan for new development.

OmoBe commented 3 years ago

Would be awesome if this is still going to be fixed. Keep Nativescript alive pls.

afearns commented 3 years ago

any updates before we reach end of 2020? -same issue here.

rickychongjl commented 3 years ago

Still waiting

abdes-zakari commented 3 years ago

I had the same issue i solve it by running the app in my physical device using : ns run android instead of running the app by ns preview To be able to run this command you need: (android configuration)

After installation of this things run ns doctor and you will see a message like this:

image

hope this will help you

rickychongjl commented 3 years ago

I had the same issue i solve it by running the app in my physical device using : ns run android instead of running the app by ns preview To be able to run this command you need: (android configuration)

  • Android SDK
  • Java (jdk 12)
  • ADB

After installation of this things run ns doctor and you will see a message like this:

image

hope this will help you

This doesn't help, what are you on about?

Dasone commented 3 years ago

Still no solution for this breaking bug. Time to abandon this sinking ship and move on for a more supported framework. It's too bad, it had so much potential.

hartbrkr3399 commented 3 years ago

@NathanWalker, please do something about the issue. Many people including me, are still waiting in this thread hoping for your answer as it is still open. Either close this or announce something brother.

ferqueve commented 3 years ago

Hi! I'm just studying Nativescript but found with this already, an error and a support failure. Will continue just for finishing the course, but I'm thinking this is not good framework for serious developments. Regards

snoop0x7b commented 3 years ago

I went to install NS and start an app with the tutorial on the website. By default, tns create pulls in Angular 11. It seems like the root cause of this issue is NS just doesn't work with Angular 10 or higher. It's a shame that the tutorial just doesn't work... Perhaps consider updating the nativescript.org tutorial in light of this issue?

NathanWalker commented 3 years ago

We recommend using xplat for code sharing. It’s better supported, more scalable and will lead you to better results. It’s been available as long as schematics here but supports angular versions faster. https://nstudio.io/xplat/getting-started

xplat uses Nrwl Nx which provides better tooling all around for effective and massive code sharing.

That being said schematics here have been updated to version 11 when angular 11 was released. These commands have been known to work just fine: https://gist.github.com/NathanWalker/266f597de1a93314bec9efa6d21c15a2

NathanWalker commented 3 years ago

Should be stated that playground is merely for demonstrations only and not recommended as a development environment. You should always take the time to setup a proper development environment locally.

Additionally, I just confirmed that from here, both directions work perfect as is: https://gist.github.com/NathanWalker/266f597de1a93314bec9efa6d21c15a2

When using Option A, if you end up with a project that has "@angular/core": "~10.1.1", - that has nothing to do with NativeScript and everything to do with the globally installed Angular cli you have. npm i -g @angular/cli to ensure the latest angular version project base is generated for you.

Always when bumping dependency version, run: ns clean and then run your project.

You can even use Angular's 11.1.0 released just this past week by bumping all dependencies. For example the following also works perfect:

"scripts": {
    "android": "ns run android",
    "ios": "ns run ios",
    "mobile": "ns run",
    "ng": "ng",
    "start": "ng serve",
    "build": "ng build",
    "test": "ng test",
    "lint": "ng lint",
    "e2e": "ng e2e"
  },
  "private": true,
  "dependencies": {
    "@nativescript/angular": "~11.0.0",
    "@nativescript/core": "~7.1.0",
    "@nativescript/theme": "~3.0.0",
    "reflect-metadata": "~0.1.12",
    "tslib": "^2.1.0",
    "@angular/animations": "~11.1.0",
    "@angular/common": "~11.1.0",
    "@angular/compiler": "~11.1.0",
    "@angular/core": "~11.1.0",
    "@angular/forms": "~11.1.0",
    "@angular/platform-browser": "~11.1.0",
    "@angular/platform-browser-dynamic": "~11.1.0",
    "@angular/router": "~11.1.0",
    "rxjs": "~6.6.0",
    "zone.js": "~0.11.0"
  },
  "devDependencies": {
    "@angular-devkit/build-angular": "~0.1101.1",
    "@angular/cli": "~11.1.0",
    "@angular/compiler-cli": "~11.1.0",
    "@nativescript/ios": "7.1.1",
    "@nativescript/schematics": "^11.0.0",
    "@nativescript/tslint-rules": "~0.0.5",
    "@nativescript/webpack": "~3.0.0",
    "@types/jasmine": "~3.5.0",
    "@types/jasminewd2": "~2.0.3",
    "@types/node": "^12.11.1",
    "codelyzer": "^6.0.0",
    "jasmine-core": "~3.6.0",
    "jasmine-spec-reporter": "~5.0.0",
    "karma": "~5.0.0",
    "karma-chrome-launcher": "~3.1.0",
    "karma-coverage-istanbul-reporter": "~3.0.2",
    "karma-jasmine": "~4.0.0",
    "karma-jasmine-html-reporter": "^1.5.0",
    "protractor": "~7.0.0",
    "ts-node": "~8.3.0",
    "tslint": "~6.1.0",
    "typescript": "~4.0.2"
  },
loubrevetti commented 3 years ago

Any ETA on this fix yet

SapioBeasley commented 3 years ago

grr

SapioBeasley commented 3 years ago

I had the same issue i solve it by running the app in my physical device using : ns run android instead of running the app by ns preview To be able to run this command you need: (android configuration)

  • Android SDK
  • Java (jdk 12)
  • ADB

After installation of this things run ns doctor and you will see a message like this: image hope this will help you

This doesn't help, what are you on about?

This actually does work ...

Let the magic happen

AndreWilsenach commented 3 years ago

its been months since this issue is reported can one of the devs just release a statement please ? are you going to fix it or not ? if you are please just state the priority of this fix (low normal high ?). It won't kill you to leave a comment saying we are not supporting nativescript anymore or something like that or just the truth.

Kind regards

martijnmichel commented 3 years ago

same

hartbrkr3399 commented 3 years ago

If you have Angular 10.x+, move to Angular 8.x guys. That's the only way now.

On Mon, 1 Mar, 2021, 11:12 pm martijnmichel, notifications@github.com wrote:

same

— You are receiving this because you commented. Reply to this email directly, view it on GitHub https://github.com/NativeScript/nativescript-schematics/issues/290#issuecomment-788137905, or unsubscribe https://github.com/notifications/unsubscribe-auth/ANF2TZ7JOBA5EUM7ZCKHMPLTBPGWXANCNFSM4PR2HLMA .

AndreWilsenach commented 3 years ago

@hartbrkr3399 Thanks for the reply

Kind regards

hartbrkr3399 commented 3 years ago

@hartbrkr3399 Thanks for the reply

Kind regards

After moving, were you able to dodge that error? Because I just said that in a guess lol.

AndreWilsenach commented 3 years ago

Nope not yet I have other projects to work on the mobile development I'm trying is more of a side thing (also I tried it out only recently to see if its a good fit for our tech stack and as good as it is (perfect) but without angular 10 support its just a matter of time before angular goes to far and you're stuck with a specific version of nativescript without any new support or tech. if we get a new angular version before we get the required support I'd suggest taking a look at react native for mobile dev)

not hating or bad mouthing nativescript I'm a huge fan boy but reality is work needs to get done and if the tools are insufficient you're setting yourself up for struggle in the long run or unwanted limitations.

dariel312 commented 3 years ago

Nope not yet I have other projects to work on the mobile development I'm trying is more of a side thing (also I tried it out only recently to see if its a good fit for our tech stack and as good as it is (perfect) but without angular 10 support its just a matter of time before angular goes to far and you're stuck with a specific version of nativescript without any new support or tech. if we get a new angular version before we get the required support I'd suggest taking a look at react native for mobile dev)

not hating or bad mouthing nativescript I'm a huge fan boy but reality is work needs to get done and if the tools are insufficient you're setting yourself up for struggle in the long run or unwanted limitations.

@the-fapeling I understand the sentiment and would like this issue to be fixed too. But this is not a complete blocker from using Nativescript with angular 10. As @abdes-zakari mentioned, you can totally run it fine with angular 10 using the android sdk and running it natively on your device. Playground is just a playground.