ui-material-components: [Angular 10] Cannot find module '@nativescript/angular/element-registry'

Hi, seems plugin doesn’t work with Angular 10

  "dependencies": {
    "@angular/animations": "~10.0.0",
    "@angular/cdk": "^10.1.1",
    "@angular/common": "~10.0.0",
    "@angular/compiler": "~10.0.0",
    "@angular/core": "~10.0.0",
    "@angular/elements": "^9.0.6",
    "@angular/flex-layout": "^10.0.0-beta.32",
    "@angular/forms": "~10.0.0",
    "@angular/http": "8.0.0-beta.10",
    "@angular/material": "10.1.1",
    "@angular/platform-browser": "~10.0.0",
    "@angular/platform-browser-dynamic": "~10.0.0",
    "@angular/pwa": "0.900.2",
    "@angular/router": "~10.0.0",
    "@angular/service-worker": "8.2.14",
    "@fortawesome/fontawesome-free": "^5.13.0",
    "@fullcalendar/core": "^5.1.0",
    "@fullcalendar/daygrid": "^5.1.0",
    "@fullcalendar/interaction": "^5.1.0",
    "@fullcalendar/list": "^5.1.0",
    "@nativescript/angular": "~10.0.0",
    "@nativescript/core": "rc",
    "@nativescript/theme": "~2.3.0",
    "@ngrx/data": "^9.2.0",
    "@ngrx/effects": "^9.2.0",
    "@ngrx/entity": "^9.2.0",
    "@ngrx/router-store": "^9.2.0",
    "@ngrx/store": "^9.2.0",
    "@ngrx/store-devtools": "^9.2.0",
    "animejs": "3.1.0",
    "chart.js": "^2.9.3",
    "core-js": "^2.6.9",
    "mapbox-gl": "^1.11.1",
    "nativescript-https": "^1.3.0",
    "nativescript-material-bottomnavigationbar": "^3.2.19",
    "nativescript-material-snackbar": "^3.1.11",
    "nativescript-secure-storage": "^2.6.1",
    "ngx-image-cropper": "3.0.3",
    "ngx-mapbox-gl": "^4.8.1",
    "reflect-metadata": "~0.1.12",
    "rxjs": "^6.6.2",
    "safe-buffer": "^5.2.1",
    "tns-core-modules": "~6.5.0",
    "tslib": "1.10.0",
    "zone.js": "~0.10.3"
  },
  "devDependencies": {
    "@angular-devkit/build-angular": "~0.1000.2",
    "@angular/cli": "~10.0.0",
    "@angular/compiler-cli": "~10.0.0",
    "@nativescript/schematics": "^10.0.1",
    "@nativescript/tslint-rules": "~0.0.5",
    "@nativescript/webpack": "^2.1.0",
    "@ngtools/webpack": "~10.0.0",
    "@types/animejs": "3.1.0",
    "@types/chart.js": "2.9.14",
    "@types/jasmine": "~3.5.0",
    "@types/jasminewd2": "~2.0.3",
    "@types/jest": "25.1.2",
    "@types/mapbox-gl": "^1.11.1",
    "@types/mapbox__polyline": "^1.0.0",
    "@types/node": "^12.11.1",
    "codelyzer": "^5.1.2",
    "jasmine-core": "~3.5.0",
    "jasmine-spec-reporter": "~4.2.1",
    "jest": "25.1.0",
    "jest-preset-angular": "8.0.0",
    "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",
    "node-sass": "^4.7.1",
    "protractor": "~5.4.3",
    "ts-node": "~8.3.0",
    "tslint": "~6.1.0",
    "typescript": "~3.9.0"
  }

ERROR in ../node_modules/nativescript-material-bottomnavigationbar/angular/nativescript-material-bottomnavigationbar.module.js
Module not found: Error: Can't resolve '@nativescript/angular/element-registry' in '/Users/ericaskari/Desktop/WEARE/lo-hi/lo-hi-frontend/node_modules/nativescript-material-bottomnavigationbar/angular'
 @ ../node_modules/nativescript-material-bottomnavigationbar/angular/nativescript-material-bottomnavigationbar.module.js 3:25-74
 @ ../node_modules/nativescript-material-bottomnavigationbar/angular/index.js
 @ ./app/app.module.tns.ts
 @ ./main.tns.ts

ZoneAwareError(file: node_modules/@nativescript/zone-js/zone-nativescript.js:1298:0)
System.err: 	at webpackMissingModule(file: node_modules/nativescript-material-bottomnavigationbar/angular/nativescript-material-bottomnavigationbar.module.js:3:33)
System.err: 	at ../node_modules/nativescript-material-bottomnavigationbar/angular/nativescript-material-bottomnavigationbar.module.js(file: node_modules/nativescript-material-bottomnavigationbar/angular/nativescript-material-bottomnavigationbar.module.js:3:33)
System.err: 	at __webpack_require__(file: src/webpack/bootstrap:816:0)
System.err: 	at fn(file: src/webpack/bootstrap:120:0)
System.err: 	at ../node_modules/nativescript-material-bottomnavigationbar/angular/index.js(file: node_modules/nativescript-material-bottomnavigationbar/angular/index.js:5:9)
System.err: 	at __webpack_require__(file: src/webpack/bootstrap:816:0)
System.err: 	at fn(file: src/webpack/bootstrap:120:0)
System.err: 	at ./app/app.module.tns.ts(file:///data/data/org.nativescript.lohisportsv1/files/app/bundle.js:2342:108)
System.err: 	at __webpack_require__(file: src/webpack/bootstrap:816:0)
System.err: 	at fn(file: src/webpack/bootstrap:120:0)
System.err: 	at (file: src/main.tns.ts:1:106)
System.err: 	at ./main.tns.ts(file:///data/data/org.nativescript.lohisportsv1/files/app/bundle.js:3089:30)
System.err: 	at __webpack_require__(file: src/webpack/bootstrap:816:0)
System.err: 	at checkDeferredModules(file: src/webpack/bootstrap:43:0)
System.err: 	at webpackJsonpCallback(file: src/webpack/bootstrap:30:0)
System.err: 	at (file:///data/data/org.nativescript.lohisportsv1/files/app/bundle.js:2:57)
System.err: 	at require(:1:266)
System.err: 
System.err: 
System.err: Error: Cannot find module '@nativescript/angular/element-registry'
System.err: 
System.err: StackTrace:
System.err: java.lang.RuntimeException: Unable to create application com.tns.NativeScriptApplication: com.tns.NativeScriptException: Error calling module function 
System.err: Error: Cannot find module '@nativescript/angular/element-registry'
System.err: File: (file: node_modules/nativescript-material-bottomnavigationbar/angular/nativescript-material-bottomnavigationbar.module.js:3:33)
System.err: 
System.err: StackTrace: 
System.err: ZoneAwareError(file: node_modules/@nativescript/zone-js/zone-nativescript.js:1298:0)
System.err: 	at webpackMissingModule(file: node_modules/nativescript-material-bottomnavigationbar/angular/nativescript-material-bottomnavigationbar.module.js:3:33)
System.err: 	at ../node_modules/nativescript-material-bottomnavigationbar/angular/nativescript-material-bottomnavigationbar.module.js(file: node_modules/nativescript-material-bottomnavigationbar/angular/nativescript-material-bottomnavigationbar.module.js:3:33)
System.err: 	at __webpack_require__(file: src/webpack/bootstrap:816:0)
System.err: 	at fn(file: src/webpack/bootstrap:120:0)
System.err: 	at ../node_modules/nativescript-material-bottomnavigationbar/angular/index.js(file: node_modules/nativescript-material-bottomnavigationbar/angular/index.js:5:9)
System.err: 	at __webpack_require__(file: src/webpack/bootstrap:816:0)
System.err: 	at fn(file: src/webpack/bootstrap:120:0)
System.err: 	at ./app/app.module.tns.ts(file:///data/data/org.nativescript.lohisportsv1/files/app/bundle.js:2342:108)
System.err: 	at __webpack_require__(file: src/webpack/bootstrap:816:0)
System.err: 	at fn(file: src/webpack/bootstrap:120:0)
System.err: 	at (file: src/main.tns.ts:1:106)
System.err: 	at ./main.tns.ts(file:///data/data/org.nativescript.lohisportsv1/files/app/bundle.js:3089:30)
System.err: 	at __webpack_require__(file: src/webpack/bootstrap:816:0)
System.err: 	at checkDeferredModules(file: src/webpack/bootstrap:43:0)
System.err: 	at webpackJsonpCallback(file: src/webpack/bootstrap:30:0)
System.err: 	at (file:///data/data/org.nativescript.lohisportsv1/files/app/bundle.js:2:57)
System.err: 	at require(:1:266)
System.err: 
System.err: 
System.err: Error: Cannot find module '@nativescript/angular/element-registry'
System.err: 	at android.app.ActivityThread.handleBindApplication(ActivityThread.java:6505)
System.err: 	at android.app.ActivityThread.access$1300(ActivityThread.java:225)
System.err: 	at android.app.ActivityThread$H.handleMessage(ActivityThread.java:1865)
System.err: 	at android.os.Handler.dispatchMessage(Handler.java:107)
System.err: 	at android.os.Looper.loop(Looper.java:359)
System.err: 	at android.app.ActivityThread.main(ActivityThread.java:7418)
System.err: 	at java.lang.reflect.Method.invoke(Native Method)
System.err: 	at com.android.internal.os.RuntimeInit$MethodAndArgsCaller.run(RuntimeInit.java:492)
System.err: 	at com.android.internal.os.ZygoteInit.main(ZygoteInit.java:935)
System.err: Caused by: com.tns.NativeScriptException: Error calling module function 
System.err: Error: Cannot find module '@nativescript/angular/element-registry'
System.err: File: (file: node_modules/nativescript-material-bottomnavigationbar/angular/nativescript-material-bottomnavigationbar.module.js:3:33)
System.err: 
System.err: StackTrace: 
System.err: ZoneAwareError(file: node_modules/@nativescript/zone-js/zone-nativescript.js:1298:0)
System.err: 	at webpackMissingModule(file: node_modules/nativescript-material-bottomnavigationbar/angular/nativescript-material-bottomnavigationbar.module.js:3:33)
System.err: 	at ../node_modules/nativescript-material-bottomnavigationbar/angular/nativescript-material-bottomnavigationbar.module.js(file: node_modules/nativescript-material-bottomnavigationbar/angular/nativescript-material-bottomnavigationbar.module.js:3:33)
System.err: 	at __webpack_require__(file: src/webpack/bootstrap:816:0)
System.err: 	at fn(file: src/webpack/bootstrap:120:0)
System.err: 	at ../node_modules/nativescript-material-bottomnavigationbar/angular/index.js(file: node_modules/nativescript-material-bottomnavigationbar/angular/index.js:5:9)
System.err: 	at __webpack_require__(file: src/webpack/bootstrap:816:0)
System.err: 	at fn(file: src/webpack/bootstrap:120:0)
System.err: 	at ./app/app.module.tns.ts(file:///data/data/org.nativescript.lohisportsv1/files/app/bundle.js:2342:108)
System.err: 	at __webpack_require__(file: src/webpack/bootstrap:816:0)
System.err: 	at fn(file: src/webpack/bootstrap:120:0)
System.err: 	at (file: src/main.tns.ts:1:106)
System.err: 	at ./main.tns.ts(file:///data/data/org.nativescript.lohisportsv1/files/app/bundle.js:3089:30)
System.err: 	at __webpack_require__(file: src/webpack/bootstrap:816:0)
System.err: 	at checkDeferredModules(file: src/webpack/bootstrap:43:0)
System.err: 	at webpackJsonpCallback(file: src/webpack/bootstrap:30:0)
System.err: 	at (file:///data/data/org.nativescript.lohisportsv1/files/app/bundle.js:2:57)
System.err: 	at require(:1:266)
System.err: 
System.err: 
System.err: Error: Cannot find module '@nativescript/angular/element-registry'
System.err: 	at com.tns.Runtime.runModule(Native Method)
System.err: 	at com.tns.Runtime.runModule(Runtime.java:674)
System.err: 	at com.tns.Runtime.run(Runtime.java:666)
System.err: 	at com.tns.NativeScriptApplication.onCreate(NativeScriptApplication.java:21)
System.err: 	at android.app.Instrumentation.callApplicationOnCreate(Instrumentation.java:1190)
System.err: 	at android.app.ActivityThread.handleBindApplication(ActivityThread.java:6500)
System.err: 	... 8 more

About this issue

  • Original URL
  • State: closed
  • Created 4 years ago
  • Comments: 19 (13 by maintainers)

Most upvoted comments

@pyrrhicman the sample definitely helped - there were 3 android classes missing NativeClass decorations; thanks again for the report.

Fix is Published in 4.0.9 👍

+1
NathanWalker on Aug 15, 2020

@pyrrhicman Ok you can use ~4.0.4 of all material plugins (https://www.npmjs.com/search?q=%40nativescript-community%2Fui-) which I have confirmed working with Ivy now. You can find a sample repo with this integrated here to double check anything against: https://github.com/NathanWalker/materialsample

+1
NathanWalker on Aug 4, 2020

@pyrrhicman posted PR here to fix the Ivy builds: https://github.com/Akylas/nativescript-material-components/pull/162/files

@Akylas can merge and publish on Monday for you to have them 👍

+1
NathanWalker on Aug 3, 2020

@pyrrhicman thanks - i just setup a harness here with rc-esm and see the same - I’ll work with Martin to post some updates to the tag with Ivy enabled and ping ya back here when clear.

+1
NathanWalker on Aug 1, 2020

@pyrrhicman You’ll want to use the new scoped material components. In a push to organize all community plugins we are publishing several in coordination with plugin authors under a new scope. Thus we have updated all material components and published them here: https://www.npmjs.com/search?q=%40nativescript-community%2Fui- You’ll find all the material components there which have been built for the latest releases. For example, to use nativescript-material-bottomnavigationbar, just switch that to this:

"@nativescript-community/ui-material-bottomnavigationbar": "latest"

If you encounter issues you can also try the new es2017 built versions which we are still polishing ahead of {N} 7 release (at end of August) but you can also try these versions:

"@nativescript-community/ui-material-bottomnavigationbar": "rc-esm"

You’ll find rc-esm versions correspond with each. Please let us know if you encounter issues and we’ll help you clear 👍

+1
NathanWalker on Aug 1, 2020
Read more comments on GitHub
← ble: Not detecting any devices
ui-material-components: Angular IOS cannot set MDTabStrip{ highlight-color: red;} →