ui-material-components icon indicating copy to clipboard operation
ui-material-components copied to clipboard

Cannot build project after install - missing props/ modules

Open Ed-Simmons opened this issue 5 years ago • 9 comments
trafficstars

Which platform(s) does your issue occur on?

  • iOS
  • emulator

Please, provide the following version numbers that your issue occurs with:

  • CLI: 7.0.6

Please, tell us how to recreate the issue in as much detail as possible.

Upon install, wither with npm i or tns plugin add, upon building my project I get several warnings about missing props, and some errors regarding missing modules:

Screenshot 2020-09-10 at 16 26 31 Screenshot 2020-09-10 at 16 25 55

I tried fixing the filepath errors manually, which allowed the webpack build to complete, but then resulted in a critical error:

Screenshot 2020-09-10 at 16 39 56

Ed-Simmons avatar Sep 10 '20 14:09 Ed-Simmons

Same issue here. Android 9.0 (Real device) CLI: 7.0.6

Seems to be an issue with es2015?

My tsconfig.ts:

{ "compilerOptions": { "module": "ESNext", "target": "es2015", "moduleResolution": "node", "experimentalDecorators": true, "emitDecoratorMetadata": true, "noEmitHelpers": true, "noEmitOnError": true, "skipLibCheck": true, "lib": [ "es2018", "es2017", "dom", "es6" ], "baseUrl": ".", "paths": { "~/*": [ "src/*" ] } }, "include": [ "src/tests/**/*.ts", "src/app/**/*.ts", "src/**/*.ios.ts", "src/**/*.android.ts" ], "files": [ "./references.d.ts", "./src/main.ts" ], "exclude": [ "node_modules", "platforms", "e2e" ] }

stefan-uhlemann77 avatar Sep 10 '20 21:09 stefan-uhlemann77

@stefan-uhlemann77 can you share your package.json?

farfromrefug avatar Sep 11 '20 09:09 farfromrefug

@stefan-uhlemann77 can you share your package.json?

{ "name": "@my-app-ng", "main": "main.js", "version": "1.0.0", "description": "My Application", "license": "SEE LICENSE IN ", "repository": "", "scripts": { "lint": "tslint "src/**/*.ts"", "ngcc": "ngcc --properties es2015 module main --first-only", "postinstall": "npm run ngcc" }, "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-material-bottomsheet": "^3.3.0", "nativescript-material-ripple": "^3.3.0", "nativescript-material-snackbar": "^3.3.0", "@nativescript/angular": "~10.1.0", "@nativescript/core": "7.0.0", "@nativescript/theme": "2.3.3", "@nstudio/nativescript-floatingactionbutton": "^2.1.0", "@nstudio/nativescript-pulltorefresh": "3.0.0", "@nstudio/nativescript-rad-imagepicker": "^2.0.5", "crypto-js": "^4.0.0", "moment": "2.27.0", "nativescript-background-http": "4.2.1", "nativescript-camera": "4.5.0", "nativescript-clipboard": "^1.2.0", "nativescript-cscreenshot": "1.0.2", "nativescript-geolocation": "5.1.0", "nativescript-image": "3.0.12", "nativescript-imagecropper": "3.0.0", "nativescript-lottie": "^5.0.0", "nativescript-menu": "^1.1.6", "nativescript-modal-datetimepicker": "^1.2.2", "nativescript-permissions": "^1.3.9", "nativescript-ui-autocomplete": "7.0.2", "nativescript-ui-calendar": "7.0.2", "nativescript-ui-chart": "~8.0.2", "nativescript-ui-dataform": "~7.0.2", "nativescript-ui-listview": "~9.0.2", "nativescript-ui-sidedrawer": "~9.0.3", "reflect-metadata": "~0.1.12", "rxjs": "^6.6.0", "zone.js": "~0.11.1" }, "devDependencies": { "@angular/cli": "10.1.0", "@angular/compiler-cli": "~10.1.0", "@nativescript/android": "7.0.0", "@nativescript/schematics": "^10.0.2", "@nativescript/types": "~7.0.0", "@nativescript/webpack": "~3.0.0", "@ngtools/webpack": "~10.1.0", "codelyzer": "~4.5.0", "node-sass": "^4.7.1", "tslint": "~5.19.0", "typescript": "~3.9.7" }, "gitHead": "xxx", "readme": "NativeScript Application" }

stefan-uhlemann avatar Sep 11 '20 10:09 stefan-uhlemann

@stefan-uhlemann77 you are using plugins not compatible with N7! Swith nativescript-material-... With @nativescript-community/ui-material-...

farfromrefug avatar Sep 11 '20 13:09 farfromrefug

@stefan-uhlemann77 you are using plugins not compatible with N7! Swith nativescript-material-... With @nativescript-community/ui-material-...

Not working. Using the exact same project with "@nativescript-community/ui-material-bottomsheet": "4.0.10", instead of "nativescript-material-bottomsheet": "^3.3.0", (also tried various versions like 4.0.0)

As soon as I place "NativeScriptMaterialBottomSheetModule.forRoot()" in the app.module.ts , the app crashes and don't recognizing any native elements like GridLayout, StackLayout etc anymore. (also tried putting it directly into the sub-modules import with no success)

Any suggestion!?

ChuXo avatar Sep 11 '20 14:09 ChuXo

You have a log of the crash ? (With the community plugin)

farfromrefug avatar Sep 11 '20 14:09 farfromrefug

ERROR in src/app/app.module.ts:41:14 - error NG1010: Value at position 8 in the NgModule.imports of AppModule is not a reference Value could not be determined statically.

41 imports: [ ~ 42

... 59

60 ], ~~~~~

src/app/app.module.ts:58:9 58 NativeScriptMaterialBottomSheetModule.forRoot() ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ Unable to evaluate this expression statically. src/app/app.module.ts:58:9 58 NativeScriptMaterialBottomSheetModule.forRoot() ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ A value for 'forRoot' cannot be determined statically, as it is an external declaration. src/app/components/employee/search-employee.component.html:1:1 - error NG8001: 'GridLayout' is not a known element:

  1. If 'GridLayout' is an Angular component, then verify that it is part of this module.
  2. To allow any element add 'NO_ERRORS_SCHEMA' to the '@NgModule.schemas' of this component.

1 <GridLayout rows="auto,48,*" (loaded)="onLoaded()">


src/app/components/employee/search-employee.component.ts:14:18
  14     templateUrl: "./search-employee.component.html",
                      ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
  Error occurs in the template of component SearchEmployeeComponent.
src/app/components/employee/search-employee.component.html:2:5 - error NG8001: 'GridLayout' is not a known element:
1. If 'GridLayout' is an Angular component, then verify that it is part of this module.
2. To allow any element add 'NO_ERRORS_SCHEMA' to the '@NgModule.schemas' of this component.

2     <GridLayout row="0" height="75" paddingTop="25" class="modal-header-bar">
    ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

src/app/components/employee/search-employee.component.ts:14:18
  14     templateUrl: "./search-employee.component.html",
                      ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
  Error occurs in the template of component SearchEmployeeComponent.
src/app/components/employee/search-employee.component.html:5:5 - error NG8001: 'SearchBar' is not a known element:
1. If 'SearchBar' is an Angular component, then verify that it is part of this module.
2. To allow any element add 'NO_ERRORS_SCHEMA' to the '@NgModule.schemas' of this component.

5     <SearchBar row="1" hint="Mitarbeiter suchen" (textChange)="onTextChanged($event)"
    ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
6         (loaded)="searchBarLoaded($event)" (clear)="onClear($event)" (submit)="onSubmit($event)"></SearchBar>

src/app/components/employee/search-employee.component.ts:14:18 14 templateUrl: "./search-employee.component.html", ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ Error occurs in the template of component SearchEmployeeComponent. src/app/components/employee/search-employee.component.html:7:5 - error NG8001: 'RadListView' is not a known element:

  1. If 'RadListView' is an Angular component, then verify that it is part of this module.
  2. To allow any element add 'NO_ERRORS_SCHEMA' to the '@NgModule.schemas' of this component.

7 <RadListView #listview row="2" [items]="dataItems" [itemTemplateSelector]="templateSelector"> ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

src/app/components/employee/search-employee.component.ts:14:18 14 templateUrl: "./search-employee.component.html", ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ Error occurs in the template of component SearchEmployeeComponent. src/app/components/employee/search-employee.component.html:7:36 - error NG8002: Can't bind to 'items' since it isn't a known property of 'RadListView'.

7 <RadListView #listview row="2" [items]="dataItems" [itemTemplateSelector]="templateSelector"> ~~~~~~~~~~~~~~~~~~~

src/app/components/employee/search-employee.component.ts:14:18 14 templateUrl: "./search-employee.component.html", ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ Error occurs in the template of component SearchEmployeeComponent. src/app/components/employee/search-employee.component.html:7:56 - error NG8002: Can't bind to 'itemTemplateSelector' since it isn't a known property of 'RadListView'.

7 <RadListView #listview row="2" [items]="dataItems" [itemTemplateSelector]="templateSelector"> ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

src/app/components/employee/search-employee.component.ts:14:18 14 templateUrl: "./search-employee.component.html", ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~0m Error occurs in the template of component SearchEmployeeComponent. src/app/components/timepicker/timepicker.component.html:1:1 - error NG8001: 'StackLayout' is not a known element:

  1. If 'StackLayout' is an Angular component, then verify that it is part of this module.
  2. To allow any element add 'NO_ERRORS_SCHEMA' to the '@NgModule.schemas' of this component.

1 <StackLayout class="page-timepicker" (loaded)="onLoaded($event)">


src/app/components/timepicker/timepicker.component.ts:19:18
  19     templateUrl: "./timepicker.component.html",
                      ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
  Error occurs in the template of component TimePickerComponent.
src/app/components/timepicker/timepicker.component.html:3:5 - error NG8001: 'GridLayout' is not a known element:
1. If 'GridLayout' is an Angular component, then verify that it is part of this module.
2. To allow any element add 'NO_ERRORS_SCHEMA' to the '@NgModule.schemas' of this component.

3     <GridLayout columns="*, 100" rows="auto, auto, auto">
    ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

src/app/components/timepicker/timepicker.component.ts:19:18
  19     templateUrl: "./timepicker.component.html",
                      ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
  Error occurs in the template of component TimePickerComponent.
src/app/components/timepicker/timepicker.component.html:6:9 - error NG8001: 'StackLayout' is not a known element:
1. If 'StackLayout' is an Angular component, then verify that it is part of this module.
2. To allow any element add 'NO_ERRORS_SCHEMA' to the '@NgModule.schemas' of this component.

6         <StackLayout col="0" colspan="2" row="2">
        ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

src/app/components/timepicker/timepicker.component.ts:19:18
  19     templateUrl: "./timepicker.component.html",
                      ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
  Error occurs in the template of component TimePickerComponent.
src/app/components/timepicker/timepicker.component.html:7:13 - error NG8001: 'TimePicker' is not a known element:
1. If 'TimePicker' is an Angular component, then verify that it is part of this module.
2. To allow any element add 'NO_ERRORS_SCHEMA' to the '@NgModule.schemas' of this component.

7             <TimePicker (loaded)="onPickerLoaded($event)" #timePicker
             ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
8                         minuteInterval="1"
 ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
9                         is24Hours="true"
 ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
10                         (timeChange)="onTimeChanged($event)">
 ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

src/app/components/timepicker/timepicker.component.ts:19:18
  19     templateUrl: "./timepicker.component.html",
                      ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
  Error occurs in the template of component TimePickerComponent.
src/app/components/availability/availability.component.html:1:1 - error NG8001: 'StackLayout' is not a known element:
1. If 'StackLayout' is an Angular component, then verify that it is part of this module.
2. To allow any element add 'NO_ERRORS_SCHEMA' to the '@NgModule.schemas' of this component.

1 <StackLayout class="page-availability" (loaded)="onLoaded($event)">

src/app/components/availability/availability.component.ts:25:18 25 templateUrl: "./availability.component.html", ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ Error occurs in the template of component AvailabilityComponent. src/app/components/availability/availability.component.html:3:5 - error NG8001: 'GridLayout' is not a known element:

  1. If 'GridLayout' is an Angular component, then verify that it is part of this module.
  2. To allow any element add 'NO_ERRORS_SCHEMA' to the '@NgModule.schemas' of this component.

3 <GridLayout columns="*, 100" rows="auto, auto, auto"> ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

src/app/components/availability/availability.component.ts:25:18 25 templateUrl: "./availability.component.html", ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ Error occurs in the template of component AvailabilityComponent. src/app/components/availability/availability.component.html:7:58 - error NG8002: Can't bind to 'text' since it isn't a known property of 'Label'.

7 <Label class="title" col="0" colspan="2" row="1" text="Verfügbarkeit am {{ date }}"></Label> ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

src/app/components/availability/availability.component.ts:25:18 25 templateUrl: "./availability.component.html", ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ Error occurs in the template of component AvailabilityComponent. src/app/components/daypicker.component.html:1:1 - error NG8001: 'GridLayout' is not a known element:

  1. If 'GridLayout' is an Angular component, then verify that it is part of this module.
  2. To allow any element add 'NO_ERRORS_SCHEMA' to the '@NgModule.schemas' of this component.

1 <GridLayout rows="auto,*" (loaded)="onLoaded()">


src/app/components/daypicker.component.ts:18:18
  18     templateUrl: "./daypicker.component.html"
                      ~~~~~~~~~~~~~~~~~~~~~~~~~~~~
  Error occurs in the template of component DayPickerComponent.
src/app/components/daypicker.component.html:2:5 - error NG8001: 'GridLayout' is not a known element:
1. If 'GridLayout' is an Angular component, then verify that it is part of this module.
2. To allow any element add 'NO_ERRORS_SCHEMA' to the '@NgModule.schemas' of this component.

2     <GridLayout row="0" height="70" class="modal-header-bar">
    ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

src/app/components/daypicker.component.ts:18:18
  18     templateUrl: "./daypicker.component.html"
                      ~~~~~~~~~~~~~~~~~~~~~~~~~~~~
  Error occurs in the template of component DayPickerComponent.
src/app/components/daypicker.component.html:5:5 - error NG8001: 'RadCalendar' is not a known element:
1. If 'RadCalendar' is an Angular component, then verify that it is part of this module.
2. To allow any element add 'NO_ERRORS_SCHEMA' to the '@NgModule.schemas' of this component.

5     <RadCalendar #calendar row="1"
      ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
6         [eventSource]="calendarEvents"
  ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
...
16         (navigatingToDateStarted)="onNavigatingToDateStarted($event)"
  ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
17         (viewModeChanged)="onViewModeChanged($event)">
  ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

src/app/components/daypicker.component.ts:18:18
  18     templateUrl: "./daypicker.component.html"
                      ~~~~~~~~~~~~~~~~~~~~~~~~~~~~
  Error occurs in the template of component DayPickerComponent.
src/app/components/daypicker.component.html:6:9 - error NG8002: Can't bind to 'eventSource' since it isn't a known property of 'RadCalendar'.

6         [eventSource]="calendarEvents"
        ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

src/app/components/daypicker.component.ts:18:18
  18     templateUrl: "./daypicker.component.html"
                      ~~~~~~~~~~~~~~~~~~~~~~~~~~~~
  Error occurs in the template of component DayPickerComponent.
src/app/components/datepicker/datepicker.component.html:1:1 - error NG8001: 'StackLayout' is not a known element:
1. If 'StackLayout' is an Angular component, then verify that it is part of this module.
2. To allow any element add 'NO_ERRORS_SCHEMA' to the '@NgModule.schemas' of this component.

1 <StackLayout class="page-datepicker" (loaded)="onLoaded($event)">

src/app/components/datepicker/datepicker.component.ts:25:18 25 templateUrl: "./datepicker.component.html", ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ Error occurs in the template of component DatePickerComponent. src/app/components/datepicker/datepicker.component.html:3:5 - error NG8001: 'GridLayout' is not a known element:

  1. If 'GridLayout' is an Angular component, then verify that it is part of this module.
  2. To allow any element add 'NO_ERRORS_SCHEMA' to the '@NgModule.schemas' of this component.

3 <GridLayout columns="*, 100" rows="auto, auto, auto"> ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

src/app/components/datepicker/datepicker.component.ts:25:18 25 templateUrl: "./datepicker.component.html", ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ Error occurs in the template of component DatePickerComponent. src/app/components/datepicker/datepicker.component.html:6:9 - error NG8001: 'StackLayout' is not a known element:

  1. If 'StackLayout' is an Angular component, then verify that it is part of this module.
  2. To allow any element add 'NO_ERRORS_SCHEMA' to the '@NgModule.schemas' of this component.

6 <StackLayout col="0" colspan="2" row="2"> ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

src/app/components/datepicker/datepicker.component.ts:25:18 25 templateUrl: "./datepicker.component.html", ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ Error occurs in the template of component DatePickerComponent. src/app/components/datepicker/datepicker.component.html:7:13 - error NG8001: 'DatePicker' is not a known element:

  1. If 'DatePicker' is an Angular component, then verify that it is part of this module.
  2. To allow any element add 'NO_ERRORS_SCHEMA' to the '@NgModule.schemas' of this component.

7 <DatePicker #datepicker ~~~~~~~~~~~~~~~~~~~~~~~ 8 [minDate]="minDate" [maxDate]="maxDate" ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ ... 14 locale="{{ locale }}" ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ 15 verticalAlignment="center"> ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

src/app/components/datepicker/datepicker.component.ts:25:18 25 templateUrl: "./datepicker.component.html", ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ Error occurs in the template of component DatePickerComponent. src/app/components/datepicker/datepicker.component.html:8:17 - error NG8002: Can't bind to 'minDate' since it isn't a known property of 'DatePicker'.

8 [minDate]="minDate" [maxDate]="maxDate" ~~~~~~~~~~~~~~~~~~~

src/app/components/datepicker/datepicker.component.ts:25:18 25 templateUrl: "./datepicker.component.html", ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ Error occurs in the template of component DatePickerComponent. src/app/components/datepicker/datepicker.component.html:8:37 - error NG8002: Can't bind to 'maxDate' since it isn't a known property of 'DatePicker'.

8 [minDate]="minDate" [maxDate]="maxDate" ~~~~~~~~~~~~~~~~~~~

src/app/components/datepicker/datepicker.component.ts:25:18 25 templateUrl: "./datepicker.component.html", ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ Error occurs in the template of component DatePickerComponent. src/app/components/datepicker/datepicker.component.html:14:17 - error NG8002: Can't bind to 'locale' since it isn't a known property of 'DatePicker'.

14 locale="{{ locale }}" ~~~~~~~~~~~~~~~~~~~~~

src/app/components/datepicker/datepicker.component.ts:25:18 25 templateUrl: "./datepicker.component.html", ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ Error occurs in the template of component DatePickerComponent. src/app/components/uploadprofileimage/uploadprofileimage.component.html:1:1 - error NG8001: 'GridLayout' is not a known element:

  1. If 'GridLayout' is an Angular component, then verify that it is part of this module.
  2. To allow any element add 'NO_ERRORS_SCHEMA' to the '@NgModule.schemas' of this component.

1 <GridLayout rows="auto,auto,auto,auto" class="bottom__sheet">


src/app/components/uploadprofileimage/uploadprofileimage.component.ts:14:18
  14     templateUrl: "./uploadprofileimage.component.html"
                      ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
  Error occurs in the template of component UploadProfileImageComponent.
src/app/components/uploadprofileimage/uploadprofileimage.component.html:2:5 - error NG8001: 'GridLayout' is not a known element:
1. If 'GridLayout' is an Angular component, then verify that it is part of this module.
2. To allow any element add 'NO_ERRORS_SCHEMA' to the '@NgModule.schemas' of this component.

2     <GridLayout row="0" columns="*,auto" class="bottom__sheet__title">
    ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

src/app/components/uploadprofileimage/uploadprofileimage.component.ts:14:18
  14     templateUrl: "./uploadprofileimage.component.html"
                      ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
  Error occurs in the template of component UploadProfileImageComponent.
src/app/components/uploadprofileimage/uploadprofileimage.component.html:6:5 - error NG8001: 'StackLayout' is not a known element:
1. If 'StackLayout' is an Angular component, then verify that it is part of this module.
2. To allow any element add 'NO_ERRORS_SCHEMA' to the '@NgModule.schemas' of this component.

6     <StackLayout row="1" class="bottom__sheet__element" (tap)="onAction('change')">
    ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

src/app/components/uploadprofileimage/uploadprofileimage.component.ts:14:18
  14     templateUrl: "./uploadprofileimage.component.html"
                      ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
  Error occurs in the template of component UploadProfileImageComponent.
src/app/components/uploadprofileimage/uploadprofileimage.component.html:7:9 - error NG8001: 'GridLayout' is not a known element:
1. If 'GridLayout' is an Angular component, then verify that it is part of this module.
2. To allow any element add 'NO_ERRORS_SCHEMA' to the '@NgModule.schemas' of this component.

7         <GridLayout columns="30,*">
        ~~~~~~~~~~~~~~~~~~~~~~~~~~~

src/app/components/uploadprofileimage/uploadprofileimage.component.ts:14:18
  14     templateUrl: "./uploadprofileimage.component.html"
                      ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
  Error occurs in the template of component UploadProfileImageComponent.
src/app/components/uploadprofileimage/uploadprofileimage.component.html:12:5 - error NG8001: 'StackLayout' is not a known element:
1. If 'StackLayout' is an Angular component, then verify that it is part of this module.
2. To allow any element add 'NO_ERRORS_SCHEMA' to the '@NgModule.schemas' of this component.

12     <StackLayout row="2" class="bottom__sheet__element" (tap)="onAction('crop')">
     ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

src/app/components/uploadprofileimage/uploadprofileimage.component.ts:14:18
  14     templateUrl: "./uploadprofileimage.component.html"
                      ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
  Error occurs in the template of component UploadProfileImageComponent.
src/app/components/uploadprofileimage/uploadprofileimage.component.html:13:9 - error NG8001: 'GridLayout' is not a known element:
1. If 'GridLayout' is an Angular component, then verify that it is part of this module.
2. To allow any element add 'NO_ERRORS_SCHEMA' to the '@NgModule.schemas' of this component.

13         <GridLayout columns="30,*">
         ~~~~~~~~~~~~~~~~~~~~~~~~~~~

src/app/components/uploadprofileimage/uploadprofileimage.component.ts:14:18
  14     templateUrl: "./uploadprofileimage.component.html"
                      ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
  Error occurs in the template of component UploadProfileImageComponent.
src/app/components/uploadprofileimage/uploadprofileimage.component.html:18:5 - error NG8001: 'StackLayout' is not a known element:
1. If 'StackLayout' is an Angular component, then verify that it is part of this module.
2. To allow any element add 'NO_ERRORS_SCHEMA' to the '@NgModule.schemas' of this component.

18     <StackLayout row="3" class="bottom__sheet__element" (tap)="onAction('remove')">
     ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

src/app/components/uploadprofileimage/uploadprofileimage.component.ts:14:18
  14     templateUrl: "./uploadprofileimage.component.html"
                      ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
  Error occurs in the template of component UploadProfileImageComponent.
src/app/components/uploadprofileimage/uploadprofileimage.component.html:19:9 - error NG8001: 'GridLayout' is not a known element:
1. If 'GridLayout' is an Angular component, then verify that it is part of this module.
2. To allow any element add 'NO_ERRORS_SCHEMA' to the '@NgModule.schemas' of this component.

19         <GridLayout columns="30,*">
         ~~~~~~~~~~~~~~~~~~~~~~~~~~~

src/app/components/uploadprofileimage/uploadprofileimage.component.ts:14:18
  14     templateUrl: "./uploadprofileimage.component.html"
                      ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
  Error occurs in the template of component UploadProfileImageComponent.
src/app/app.component.html:1:1 - error NG8001: 'page-router-outlet' is not a known element:
1. If 'page-router-outlet' is an Angular component, then verify that it is part of this module.
2. If 'page-router-outlet' is a Web Component then add 'CUSTOM_ELEMENTS_SCHEMA' to the '@NgModule.schemas' of this component to suppress this message.

1 <page-router-outlet></page-router-outlet>
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
src/app/app.component.ts:11:18
  11     templateUrl: "app.component.html"
                      ~~~~~~~~~~~~~~~~~~~~
  Error occurs in the template of component AppComponent.

ChuXo avatar Sep 11 '20 15:09 ChuXo

OK seems to be an issue with bottomsheet angular. Sadly I really don't a lot about angular :s I ll try and have a look

farfromrefug avatar Sep 11 '20 17:09 farfromrefug

TLDR; Worth a shot - did you try adding an entry for this in ngcc.config.js? As described here: https://github.com/NativeScript/nativescript-angular/wiki/Updating-and-developing-for-@nativescript-angular-v9-with-Ivy-or-without

Longer version: I ran into the above, which looks similar in nature to what you're seeing and what was reported in https://github.com/nativescript-community/ui-material-components/issues/177

error NG1010: Value at position 5 in the NgModule.imports of SharedModule is not a reference: [object Object]
 41     imports: [
                 ~
 42         NativeScriptCommonModule,
    ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
...
 53         // DropDownModule,
    ~~~~~~~~~~~~~~~~~~~~~~~~~~
 54     ],

My solution was to add this to ngcc.config.js:

 "@nativescript-community/ui-material-bottomsheet": {
            entryPoints: {
                angular: {
                    ignoreMissingDependencies: true,
                },
            },
            ignorableDeepImportMatchers: [/tns-core-modules\//, /@nativescript\/core\//, /@nativescript\/angular\//],
        },

And then: yarn clean && yarn (from package.json - "clean": "npx rimraf hooks node_modules package-lock.json platforms") and then ns run android and my issues went away. I'm still fighting other upgrade issues but this resolved the bottom sheet problem for me.

Edit - the documentation on what specifically is really needed in ngcc.config.js is very scant. It is possible that some of the above entry is not required.

rbudnar avatar Sep 21 '20 13:09 rbudnar