NativeScript Error NG8001: 'ActionBar' is not a known element - node.js

My startupscreen.module.ts looks like this:
import { NativeScriptFormsModule } from "#nativescript/angular";
import { NativeScriptCommonModule } from "#nativescript/angular/common";
import { NgModule, NO_ERRORS_SCHEMA } from "#angular/core";
import { StartupscreenComponent } from "./startupscreen.component";
#NgModule({
imports: [
NativeScriptFormsModule,
NativeScriptCommonModule
],
declarations: [
StartupscreenComponent
],
schemas: [
NO_ERRORS_SCHEMA
],
})
export class StartupscreenModule { }
My app.module.ts looks like this:
import { NgModule, NO_ERRORS_SCHEMA } from "#angular/core";
import { NativeScriptFormsModule, NativeScriptModule } from "#nativescript/angular";
import { FormsModule} from '#angular/forms'
import { AppRoutingModule } from "./app-routing.module";
import { AppComponent } from "./app.component";
import { BrowserModule } from '#angular/platform-browser';
import { StartupscreenModule } from "./startupscreen/startupscreen.module";
#NgModule({
bootstrap: [
AppComponent
],
imports: [
FormsModule,
BrowserModule,
NativeScriptModule,
NativeScriptFormsModule,
AppRoutingModule,
NativeScriptFormsModule,
StartupscreenModule,
],
declarations: [
AppComponent
],
schemas: [
NO_ERRORS_SCHEMA
]
})
export class AppModule { }
And i always get that error whencompiling.
Everything should be running.
My Path looks like this:
Full Error:
ERROR in ./app/startupscreen/startupscreen.module.ts
Module not found: Error: Can't resolve '#nativescript/angular/common' in 'E:\Users\SwaX\Desktop\MorseChat\src\app\startupscreen'
# ./app/startupscreen/startupscreen.module.ts 2:0-72 11:12-36 14:8-32 20:20-44
# ./app/app.module.ts
# ./main.ts
Error from chokidar (E:\): Error: EBUSY: resource busy or locked, lstat 'E:\swapfile.sys'
(node:11364) UnhandledPromiseRejectionWarning: Error: ENOENT: no such file or directory, stat 'E:\Users\Default User'
(Use `node --trace-warnings ...` to show where the warning was created)
(node:11364) UnhandledPromiseRejectionWarning: Unhandled promise rejection. This error originated either by throwing inside of an async function without a catch block, or by rejecting a promise which was not handled with .catch(). To terminate the node process on unhandled promise rejection, use the CLI flag `--unhandled-rejections=strict` (see https://nodejs.org/api/cli.html#cli_unhandled_rejections_mode). (rejection id: 7)
(node:11364) [DEP0018] DeprecationWarning: Unhandled promise rejections are deprecated. In the future, promise rejections that are not handled will terminate the Node.js process with a non-zero exit code.
And after i remove the Startupscreen in the app.module.ts it says that it cannot find .
startupscreen.component.html:
<ActionBar title="Startupscreen">
<NavigationButton (tap)="onBackTap()" android.systemIcon="ic_menu_back"></NavigationButton>
</ActionBar>
<StackLayout class="page">
<StackLayout class="box box-1">
<Label textWrap="true" text="Bitte hier klicken wenn Sie sehen können."></Label>
</StackLayout>
<StackLayout class="box box-2">
<Label textWrap="true" text="Bitte hier klicken wenn Sie Taubblind sind."></Label>
</StackLayout>
</StackLayout>

I believe that the path for NativescriptCommonModule is just #nativescript/angular similar to NativeScriptFormsModule
import { NativeScriptCommonModule } from "#nativescript/angular";

Related

"gulp serve" is returning workbench.html that i can not add the web part to

I have developed an SPFx web part with this details:-
yo-rc.json for the project, is:-
{
"#microsoft/generator-sharepoint": {
"isCreatingSolution": true,
"environment": "spo",
"version": "1.12.1",
"libraryName": "spfx-my-modal-popup",
"libraryId": "616c9b54-d123-42d8-9942-9abb0fe4f46c",
"packageManager": "npm",
"isDomainIsolated": false,
"componentType": "webpart"
}
}
now i installed nvm to be able to run multiple node versions, here what i did so far:-
1- I install node version 10.24.1 , then i use it as follow :-
nvm use 10.24.1
2- i run :-
gulp serve
The https://localhost:4321/temp/workbench.html opened but when i tried to add the web part by clicking on the + icon i will get this error inside the F12 developer tool:-
here is the full error:-
[1636842661379][PropertyPaneLoader] [SPLoaderError.loadComponentError]:
***Failed to load component "f9e737b7-f0df-4597-ba8c-3060f82380db" (SPPropertyPane). Original error: ***Failed to load URL 'https://localhost:4321/node_modules/#microsoft/sp-property-pane/dist/dist/sp-property-pane_en-us.js' for resource 'sp-property-pane' in component 'f9e737b7-f0df-4597-ba8c-3060f82380db' (SPPropertyPane). The file was not found in the server. Make sure that you are running 'gulp serve'.
***INNERERROR:
***Failed to load URL 'https://localhost:4321/node_modules/#microsoft/sp-property-pane/dist/dist/sp-property-pane_en-us.js' for resource 'sp-property-pane' in component 'f9e737b7-f0df-4597-ba8c-3060f82380db' (SPPropertyPane). The file was not found in the server. Make sure that you are running 'gulp serve'.
***CALLSTACK:
SPError#https://localhost:4321/temp/workbench-packages/#microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:24443:24
SPLoaderError#https://localhost:4321/temp/workbench-packages/#microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:42161:28
ff4n/ErrorBuilder</ErrorBuilder.buildErrorWithVerboseLog#https://localhost:4321/temp/workbench-packages/#microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:46155:21
ff4n/ErrorBuilder</ErrorBuilder.buildLoadComponentError#https://localhost:4321/temp/workbench-packages/#microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:46024:21
_loadComponentImpl/<#https://localhost:4321/temp/workbench-packages/#microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:45362:75
promise callback*_loadComponentImpl#https://localhost:4321/temp/workbench-packages/#microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:45361:8
_loadComponentRetryStrategy#https://localhost:4321/temp/workbench-packages/#microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:45299:12
_loadComponentRetryStrategy/<#https://localhost:4321/temp/workbench-packages/#microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:45309:20
promise callback*_loadComponentRetryStrategy#https://localhost:4321/temp/workbench-packages/#microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:45304:10
_loadComponentRetryStrategy/<#https://localhost:4321/temp/workbench-packages/#microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:45309:20
promise callback*_loadComponentRetryStrategy#https://localhost:4321/temp/workbench-packages/#microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:45304:10
loadComponent#https://localhost:4321/temp/workbench-packages/#microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:45281:55
++S4/SPRequireJsComponentLoader</SPRequireJsComponentLoader.prototype._loadComponentWithExecutor#https://localhost:4321/temp/workbench-packages/#microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:41771:85
td2X/LoadComponentExecutor</LoadComponentExecutor.prototype.loadComponent#https://localhost:4321/temp/workbench-packages/#microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:46896:21
++S4/SPRequireJsComponentLoader</SPRequireJsComponentLoader.prototype.loadComponent#https://localhost:4321/temp/workbench-packages/#microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:41742:44
Uk6p/BaseComponentLoader</BaseComponentLoader.prototype.loadComponentById#https://localhost:4321/temp/workbench-packages/#microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:44816:25
KZU3/SPComponentLoader</SPComponentLoader.loadComponentById#https://localhost:4321/temp/workbench-packages/#microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:43438:44
get#https://localhost:4321/temp/workbench-packages/#microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:110639:99
set#https://localhost:4321/temp/workbench-packages/#microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:16957:21
set#https://localhost:4321/temp/workbench-packages/#microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:14989:13
CanvasToolboxHint/_this._handleClick#https://localhost:4321/temp/workbench-packages/#microsoft_sp-webpart-workbench/local-workbench/chunk.sp-canvas-edit_7833b0118fe685da1388.js:3982:17
callCallback#https://localhost:4321/temp/workbench-packages/#microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:75432:14
invokeGuardedCallbackDev#https://localhost:4321/temp/workbench-packages/#microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:75482:16
invokeGuardedCallback#https://localhost:4321/temp/workbench-packages/#microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:75539:31
invokeGuardedCallbackAndCatchFirstError#https://localhost:4321/temp/workbench-packages/#microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:75553:25
executeDispatch#https://localhost:4321/temp/workbench-packages/#microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:75844:42
executeDispatchesInOrder#https://localhost:4321/temp/workbench-packages/#microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:75866:20
executeDispatchesAndRelease#https://localhost:4321/temp/workbench-packages/#microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:75963:29
executeDispatchesAndReleaseTopLevel#https://localhost:4321/temp/workbench-packages/#microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:75971:10
forEachAccumulated#https://localhost:4321/temp/workbench-packages/#microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:75945:8
runEventsInBatch#https://localhost:4321/temp/workbench-packages/#microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:76099:21
runExtractedEventsInBatch#https://localhost:4321/temp/workbench-packages/#microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:76107:19
handleTopLevel#https://localhost:4321/temp/workbench-packages/#microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:80109:30
batchedUpdates$1#https://localhost:4321/temp/workbench-packages/#microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:95687:12
batchedUpdates#https://localhost:4321/temp/workbench-packages/#microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:77434:12
dispatchEvent#https://localhost:4321/temp/workbench-packages/#microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:80188:19
interactiveUpdates$1/<#https://localhost:4321/temp/workbench-packages/#microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:95738:14
unstable_runWithPriority#https://localhost:4321/temp/workbench-packages/#microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:97248:12
interactiveUpdates$1#https://localhost:4321/temp/workbench-packages/#microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:95737:22
sp-webpart-workbench-assembly_default.js:26401:21
Uncaught (in promise) Error: ***Failed to load component "f9e737b7-f0df-4597-ba8c-3060f82380db" (SPPropertyPane). Original error: ***Failed to load URL 'https://localhost:4321/node_modules/#microsoft/sp-property-pane/dist/dist/sp-property-pane_en-us.js' for resource 'sp-property-pane' in component 'f9e737b7-f0df-4597-ba8c-3060f82380db' (SPPropertyPane). The file was not found in the server. Make sure that you are running 'gulp serve'.
SPError https://localhost:4321/temp/workbench-packages/#microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:24443
SPLoaderError https://localhost:4321/temp/workbench-packages/#microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:42161
buildErrorWithVerboseLog https://localhost:4321/temp/workbench-packages/#microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:46155
buildLoadComponentError https://localhost:4321/temp/workbench-packages/#microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:46024
_loadComponentImpl https://localhost:4321/temp/workbench-packages/#microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:45362
promise callback*_loadComponentImpl https://localhost:4321/temp/workbench-packages/#microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:45361
_loadComponentRetryStrategy https://localhost:4321/temp/workbench-packages/#microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:45299
_loadComponentRetryStrategy https://localhost:4321/temp/workbench-packages/#microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:45309
promise callback*_loadComponentRetryStrategy https://localhost:4321/temp/workbench-packages/#microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:45304
_loadComponentRetryStrategy https://localhost:4321/temp/workbench-packages/#microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:45309
promise callback*_loadComponentRetryStrategy https://localhost:4321/temp/workbench-packages/#microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:45304
loadComponent https://localhost:4321/temp/workbench-packages/#microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:45281
loadComponent https://localhost:4321/temp/workbench-packages/#microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:46458
_loadComponentImpl https://localhost:4321/temp/workbench-packages/#microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:43631
promise callback*PypK/SystemJsFallbackLoader</SystemJsFallbackLoader.prototype._loadComponentImpl https://localhost:4321/temp/workbench-packages/#microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:43621
loadComponent https://localhost:4321/temp/workbench-packages/#microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:46896
loadComponent https://localhost:4321/temp/workbench-packages/#microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:43617
_loadComponentWithExecutor https://localhost:4321/temp/workbench-packages/#microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:41781
promise callback*++S4/SPRequireJsComponentLoader</SPRequireJsComponentLoader.prototype._loadComponentWithExecutor https://localhost:4321/temp/workbench-packages/#microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:41777
loadComponent https://localhost:4321/temp/workbench-packages/#microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:46896
loadComponent https://localhost:4321/temp/workbench-packages/#microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:41742
loadComponentById https://localhost:4321/temp/workbench-packages/#microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:44816
loadComponentById https://localhost:4321/temp/workbench-packages/#microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:43438
get https://localhost:4321/temp/workbench-packages/#microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:110639
set https://localhost:4321/temp/workbench-packages/#microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:16957
set https://localhost:4321/temp/workbench-packages/#microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:14989
_handleClick https://localhost:4321/temp/workbench-packages/#microsoft_sp-webpart-workbench/local-workbench/chunk.sp-canvas-edit_7833b0118fe685da1388.js:3982
callCallback https://localhost:4321/temp/workbench-packages/#microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:75432
invokeGuardedCallbackDev https://localhost:4321/temp/workbench-packages/#microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:75482
invokeGuardedCallback https://localhost:4321/temp/workbench-packages/#microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:75539
invokeGuardedCallbackAndCatchFirstError https://localhost:4321/temp/workbench-packages/#microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:75553
executeDispatch https://localhost:4321/temp/workbench-packages/#microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:75844
executeDispatchesInOrder https://localhost:4321/temp/workbench-packages/#microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:75866
executeDispatchesAndRelease https://localhost:4321/temp/workbench-packages/#microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:75963
executeDispatchesAndReleaseTopLevel https://localhost:4321/temp/workbench-packages/#microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:75971
forEachAccumulated https://localhost:4321/temp/workbench-packages/#microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:75945
runEventsInBatch https://localhost:4321/temp/workbench-packages/#microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:76099
runExtractedEventsInBatch https://localhost:4321/temp/workbench-packages/#microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:76107
handleTopLevel https://localhost:4321/temp/workbench-packages/#microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:80109
batchedUpdates$1 https://localhost:4321/temp/workbench-packages/#microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:95687
batchedUpdates https://localhost:4321/temp/workbench-packages/#microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:77434
dispatchEvent https://localhost:4321/temp/workbench-packages/#microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:80188
1 https://localhost:4321/temp/workbench-packages/#microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:95738
unstable_runWithPriority https://localhost:4321/temp/workbench-packages/#microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:97248
interactiveUpdates$1 https://localhost:4321/temp/workbench-packages/#microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:95737
interactiveUpdates https://localhost:4321/temp/workbench-packages/#microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:77453
dispatchInteractiveEvent https://localhost:4321/temp/workbench-packages/#microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:80165
sp-webpart-workbench-assembly_default.js:24430:28
Uncaught (in promise) Error: ***Failed to load component "f9e737b7-f0df-4597-ba8c-3060f82380db" (SPPropertyPane). Original error: ***Failed to load URL 'https://localhost:4321/node_modules/#microsoft/sp-property-pane/dist/dist/sp-property-pane_en-us.js' for resource 'sp-property-pane' in component 'f9e737b7-f0df-4597-ba8c-3060f82380db' (SPPropertyPane). The file was not found in the server. Make sure that you are running 'gulp serve'.
SPError https://localhost:4321/temp/workbench-packages/#microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:24443
SPLoaderError https://localhost:4321/temp/workbench-packages/#microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:42161
buildErrorWithVerboseLog https://localhost:4321/temp/workbench-packages/#microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:46155
buildLoadComponentError https://localhost:4321/temp/workbench-packages/#microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:46024
_loadComponentImpl https://localhost:4321/temp/workbench-packages/#microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:45362
promise callback*_loadComponentImpl https://localhost:4321/temp/workbench-packages/#microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:45361
_loadComponentRetryStrategy https://localhost:4321/temp/workbench-packages/#microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:45299
_loadComponentRetryStrategy https://localhost:4321/temp/workbench-packages/#microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:45309
promise callback*_loadComponentRetryStrategy https://localhost:4321/temp/workbench-packages/#microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:45304
_loadComponentRetryStrategy https://localhost:4321/temp/workbench-packages/#microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:45309
promise callback*_loadComponentRetryStrategy https://localhost:4321/temp/workbench-packages/#microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:45304
loadComponent https://localhost:4321/temp/workbench-packages/#microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:45281
_loadComponentWithExecutor https://localhost:4321/temp/workbench-packages/#microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:41771
loadComponent https://localhost:4321/temp/workbench-packages/#microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:46896
loadComponent https://localhost:4321/temp/workbench-packages/#microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:41742
loadComponentById https://localhost:4321/temp/workbench-packages/#microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:44816
loadComponentById https://localhost:4321/temp/workbench-packages/#microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:43438
get https://localhost:4321/temp/workbench-packages/#microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:110639
set https://localhost:4321/temp/workbench-packages/#microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:16957
set https://localhost:4321/temp/workbench-packages/#microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:14989
_handleClick https://localhost:4321/temp/workbench-packages/#microsoft_sp-webpart-workbench/local-workbench/chunk.sp-canvas-edit_7833b0118fe685da1388.js:3982
callCallback https://localhost:4321/temp/workbench-packages/#microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:75432
invokeGuardedCallbackDev https://localhost:4321/temp/workbench-packages/#microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:75482
invokeGuardedCallback https://localhost:4321/temp/workbench-packages/#microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:75539
invokeGuardedCallbackAndCatchFirstError https://localhost:4321/temp/workbench-packages/#microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:75553
executeDispatch https://localhost:4321/temp/workbench-packages/#microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:75844
executeDispatchesInOrder https://localhost:4321/temp/workbench-packages/#microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:75866
executeDispatchesAndRelease https://localhost:4321/temp/workbench-packages/#microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:75963
executeDispatchesAndReleaseTopLevel https://localhost:4321/temp/workbench-packages/#microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:75971
forEachAccumulated https://localhost:4321/temp/workbench-packages/#microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:75945
runEventsInBatch https://localhost:4321/temp/workbench-packages/#microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:76099
runExtractedEventsInBatch https://localhost:4321/temp/workbench-packages/#microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:76107
handleTopLevel https://localhost:4321/temp/workbench-packages/#microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:80109
batchedUpdates$1 https://localhost:4321/temp/workbench-packages/#microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:95687
batchedUpdates https://localhost:4321/temp/workbench-packages/#microsoft_sp-webpart-workbench/local-workbench/sp-webpart-workbench-assembly_default.js:77434
dispatchEvent https://localhost:4321/temp/workbench-packages
here is my MyModalPopupWebPart.ts:-
import * as React from 'react';
import * as ReactDom from 'react-dom';
import { Version } from '#microsoft/sp-core-library';
import {
IPropertyPaneConfiguration,
PropertyPaneTextField
} from '#microsoft/sp-property-pane';
import { BaseClientSideWebPart } from '#microsoft/sp-webpart-base';
import * as strings from 'MyModalPopupWebPartStrings';
import MyModalPopup from './components/MyModalPopup';
import { IMyModalPopupProps } from './components/IMyModalPopupProps';
export interface IMyModalPopupWebPartProps {
description: string;
WhoWeAre: string;
OurValue:string;
}
export default class MyModalPopupWebPart extends BaseClientSideWebPart<IMyModalPopupWebPartProps> {
public render(): void {
const element: React.ReactElement<IMyModalPopupProps> = React.createElement(
MyModalPopup,
{
description: this.properties.description,
WhoWeAre: this.properties.WhoWeAre,
OurValue: this.properties.OurValue
}
);
ReactDom.render(element, this.domElement);
}
protected onDispose(): void {
ReactDom.unmountComponentAtNode(this.domElement);
}
protected get dataVersion(): Version {
return Version.parse('1.0');
}
protected getPropertyPaneConfiguration(): IPropertyPaneConfiguration {
return {
pages: [
{
header: {
description: strings.PropertyPaneDescription
},
groups: [
{
groupName: strings.BasicGroupName,
groupFields: [
PropertyPaneTextField('WhoWeAre', {
label: "who We Are",
multiline: true
}),
PropertyPaneTextField('OurValue', {
label: "Our value",
multiline: true
}), PropertyPaneTextField('description', {
label: "Description"
}),
]
}
]
}
]
};
}
}
here is my MYModal.tsx:-
import * as React from 'react';
import { useId, useBoolean } from '#fluentui/react-hooks';
import { sanitize } from 'dompurify';
import {
getTheme,
mergeStyleSets,
FontWeights,
Modal,
IIconProps,
IStackProps,
} from '#fluentui/react';
import { IconButton, IButtonStyles } from '#fluentui/react/lib/Button';
export const MYModal = (myprops) => {
const [isModalOpen, { setTrue: showModal, setFalse: hideModal }] = useBoolean(false);
const [isPopup, setisPopup] = React.useState(true);
const titleId = useId('title');
React.useEffect(() => {
showModal();
}, [isPopup]);
function ExitHandler() {
hideModal();
setisPopup(current => !current)
myprops.handler();
}
return (
<div>
<Modal
titleAriaId={titleId}
isOpen={isModalOpen}
onDismiss={ExitHandler}
isBlocking={true}
containerClassName={contentStyles.container}
>
<div className={contentStyles.header}>
<span id={titleId}>Modal Popup</span>
<IconButton
styles={iconButtonStyles}
iconProps={cancelIcon}
ariaLabel="Close popup modal"
onClick={ExitHandler}
/>
</div>
<div className={contentStyles.body}>
<div dangerouslySetInnerHTML={{ __html: sanitize(myprops.WhoWeAre) }} />
</div>
</Modal>
</div>
);
};
here is my MyModalPopup.tsx:-
import * as React from 'react';
import { IMyModalPopupProps } from './IMyModalPopupProps';
import { DefaultButton } from '#fluentui/react/lib/Button';
import { MYModal } from './MYModal';
import { MYModal2 } from './MYModal2';
interface IPopupState {
showModal: string;
}
export default class MyModalPopup extends React.Component<IMyModalPopupProps, IPopupState> {
constructor(props: IMyModalPopupProps, state: IPopupState) {
super(props);
this.state = {
showModal: ''
};
this.handler = this.handler.bind(this);
this.Buttonclick = this.Buttonclick.bind(this);
}
handler() {
this.setState({
showModal: ''
})
}
private Buttonclick(e, whichModal) {
e.preventDefault();
this.setState({ showModal: whichModal });
}
public render(): React.ReactElement<IMyModalPopupProps> {
const { showModal } = this.state;
return (
<div>
<DefaultButton onClick={(e) => this.Buttonclick(e, 'our-value')} text="Our Value" />
{ showModal === 'our-value' && <MYModal2 OurValue={this.props.OurValue} myprops={this.state} handler={this.handler} />}
<DefaultButton onClick={(e) => this.Buttonclick(e, 'who-we-are')} text="Who We Are" />
{ showModal === 'who-we-are' && <MYModal WhoWeAre={this.props.WhoWeAre} myprops={this.state} handler={this.handler} />}
</div>
);
}
}
It seems there is double "dist" in the URL you have. You need to remove one somehow:
.../sp-property-pane/dist/dist/sp-property-pane_en/...
It seems to be some project misconfiguration issue. I would recommend you to create a new project, following the steps from the "getting started" official tutorial here:
https://learn.microsoft.com/en-us/sharepoint/dev/spfx/web-parts/get-started/build-a-hello-world-web-part
Make sure you have the recommended version of node installed (there is "set up your development environment" chapter, please make sure you follow what is written there).

Error: Unexpected value 'HttpClient' imported by the module 'AppModule'. Please add a #NgModule annotation

I do not understand why I am getting this error:
Error: Unexpected value 'HttpClient' imported by the module 'AppModule'. Please add a #NgModule annotation.
I have tried both:
import { HttpClient } from '#angular/common/http';
and
import { HttpClientModule } from '#angular/common/http';
This is the full error:
Error: Unexpected value 'HttpClient' imported by the module 'AppModule'. Please add a #NgModule annotation.
at syntaxError (http://localhost:8100/build/vendor.js:116430:34)
at http://localhost:8100/build/vendor.js:131184:44
at Array.forEach (<anonymous>)
at CompileMetadataResolver.getNgModuleMetadata (http://localhost:8100/build/vendor.js:131159:49)
at JitCompiler._loadModules (http://localhost:8100/build/vendor.js:150357:87)
at JitCompiler._compileModuleAndComponents (http://localhost:8100/build/vendor.js:150318:36)
at JitCompiler.compileModuleAsync (http://localhost:8100/build/vendor.js:150212:37)
at CompilerImpl.compileModuleAsync (http://localhost:8100/build/vendor.js:115251:49)
at PlatformRef.bootstrapModule (http://localhost:8100/build/vendor.js:5952:25)
at Object.491 (http://localhost:8100/build/main.js:2405:109)
Ionic Framework: 3.9.2
Ionic Native: ^2.9.0
Ionic App Scripts: 3.2.4
Angular Core: 5.2.11
Angular Compiler CLI: 5.2.11
Node: 8.10.0
OS: Windows 10
You need import HttpClientModule, example:
import { HttpClientModule } from '#angular/common/http';
#NgModule({
imports: [
BrowserModule,
// import HttpClientModule after BrowserModule.
HttpClientModule,
],
declarations: [
AppComponent,
],
bootstrap: [ AppComponent ]
})
export class AppModule {}
Read: Angula HttpClient

TypeError: Cannot read property 'getGlobalEventTarget' of null

I was upgrading my project angular version from 4.4.7 to latest. I updated my node.js to the latest( 8.11.1 ) and also angular cli to the latest( 1.7.4 ). Now when I am running my code with npm start here is the full error.
core.es5.js:1020 ERROR Error: Uncaught (in promise): TypeError:
Cannot read property 'getGlobalEventTarget' of null
TypeError: Cannot read property 'getGlobalEventTarget' of null
at DomEventsPlugin.EventManagerPlugin.addGlobalEventListener
(platform-browser.es5.js:2474)
at EventManager.addGlobalEventListener (platform-browser.es5.js:2405)
at DefaultDomRenderer2.listen (platform-browser.es5.js:2912)
at BaseAnimationRenderer.listen (animations.es5.js:491)
at listenToElementOutputs (core.es5.js:9215)
at createViewNodes (core.es5.js:12159)
at createRootView (core.es5.js:12082)
at Object.createProdRootView [as createRootView] (core.es5.js:12756)
at ComponentFactory_.create (core.es5.js:9861)
at ComponentFactoryBoundToModule.create (core.es5.js:3333)
at DomEventsPlugin.EventManagerPlugin.addGlobalEventListener (platform-browser.es5.js:2474)
at EventManager.addGlobalEventListener (platform-browser.es5.js:2405)
at DefaultDomRenderer2.listen (platform-browser.es5.js:2912)
at BaseAnimationRenderer.listen (animations.es5.js:491)
at listenToElementOutputs (core.es5.js:9215)
at createViewNodes (core.es5.js:12159)
at createRootView (core.es5.js:12082)
at Object.createProdRootView [as createRootView] (core.es5.js:12756)
at ComponentFactory_.create (core.es5.js:9861)
at ComponentFactoryBoundToModule.create (core.es5.js:3333)
at resolvePromise (zone.js:814)
at resolvePromise (zone.js:771)
at zone.js:873
at ZoneDelegate.invokeTask (zone.js:421)
at Object.onInvokeTask (core.es5.js:3881)
at ZoneDelegate.invokeTask (zone.js:420)
at Zone.runTask (zone.js:188)
at drainMicroTaskQueue (zone.js:595)
at ZoneTask.invokeTask [as invoke] (zone.js:500)
at invokeTask (zone.js:1540)
Please remove the angular BrowserModule, BrowserAnimationsModule/NoopAnimationsModule import from the child module.
And include these imports in the Parent Module and you are good to go.
//import { BrowserModule } from '#angular/platform-browser';
//import { BrowserAnimationsModule, NoopAnimationsModule } from '#angular/platform-browser/animations';
#NgModule({
declarations: [..],
imports: [
CommonModule,
//BrowserModule,
//BrowserAnimationsModule,
//NoopAnimationsModule,
],
providers: [],
})
export class ChildModule { }

Autocomplete Material Angular 2 implementation Error

I have an error in regards with the angular 2 when I implement with autocomplete on material design and I have no idea why because it is my first time implementing it practicing with backend asp.net core. I tried installing some of the ng2 libraries but does not work at all. Here is my code below:
import { Component } from '#angular/core';
import { WebServiceComponents } from '../WebService/web.service';
import { FormControl } from '#angular/forms';
import 'rxjs/add/operator/startWith';
import 'rxjs/add/operator/map';
#Component({
selector: 'new-user-account',
template: `
<md-card class="card-margin">
<md-card-content>
<md-input-container>
<input mdInput placeholder="Select Employee" [mdAutocomplete]="auto" [formControl]="UserAccountCtrl" /><br />
</md-input-container>
<md-autocomplete #auto="mdAutocomplete">
<md-option *ngFor="let userAccount of filterUserAccount | async" [value]="userAccount">
{{userAccount.username}}
</md-option>
</md-autocomplete>
<md-input-container>
<input mdInput placeholder="Username" /><br />
</md-input-container>
</md-card-content>
</md-card>
`
})
export class NewUserAccountComponent{
UserAccountCtrl: FormControl;
filterUserAccount: any;
async ngOnInit(){
var response = await this.webService.getUserAccounts();
this.userAccounts = response.json();
}
userAccounts = [];
constructor(private webService : WebServiceComponents){
this.UserAccountCtrl = new FormControl();
this.filterUserAccount = this.UserAccountCtrl.valueChanges
.startWith(null)
.map(name => this.filterUserAccount(name));
}
filteredUserAccount(val: string) {
return val ? this.userAccounts.filter(s => new RegExp(`^${val}`, 'gi').test(s))
: this.userAccounts;
}
}
And the error as follows below:
zone.js:645 Error: Uncaught (in promise): Error: Template parse errors:
Can't bind to 'formControl' since it isn't a known property of 'input'. ("ainer>
<input mdInput placeholder="Select Employee" [mdAutocomplete]="auto" [ERROR ->][formControl]="UserAccountCtrl" /><br />
</md-input-container>
"): ng:///AppModule/NewUserAccountComponent.html#4:93
Error: Template parse errors:
Can't bind to 'formControl' since it isn't a known property of 'input'. ("ainer>
<input mdInput placeholder="Select Employee" [mdAutocomplete]="auto" [ERROR ->][formControl]="UserAccountCtrl" /><br />
</md-input-container>
"): ng:///AppModule/NewUserAccountComponent.html#4:93
at syntaxError (http://localhost:3002/node_modules/#angular/compiler/bundles/compiler.umd.js:1513:34)
at TemplateParser.parse (http://localhost:3002/node_modules/#angular/compiler/bundles/compiler.umd.js:11951:19)
at JitCompiler._compileTemplate (http://localhost:3002/node_modules/#angular/compiler/bundles/compiler.umd.js:25723:39)
at eval (http://localhost:3002/node_modules/#angular/compiler/bundles/compiler.umd.js:25647:62)
at Set.forEach (native)
at JitCompiler._compileComponents (http://localhost:3002/node_modules/#angular/compiler/bundles/compiler.umd.js:25647:19)
at createResult (http://localhost:3002/node_modules/#angular/compiler/bundles/compiler.umd.js:25532:19)
at ZoneDelegate.invoke (http://localhost:3002/node_modules/zone.js/dist/zone.js:391:26)
at Zone.run (http://localhost:3002/node_modules/zone.js/dist/zone.js:141:43)
at http://localhost:3002/node_modules/zone.js/dist/zone.js:818:57
at syntaxError (http://localhost:3002/node_modules/#angular/compiler/bundles/compiler.umd.js:1513:34)
at TemplateParser.parse (http://localhost:3002/node_modules/#angular/compiler/bundles/compiler.umd.js:11951:19)
at JitCompiler._compileTemplate (http://localhost:3002/node_modules/#angular/compiler/bundles/compiler.umd.js:25723:39)
at eval (http://localhost:3002/node_modules/#angular/compiler/bundles/compiler.umd.js:25647:62)
at Set.forEach (native)
at JitCompiler._compileComponents (http://localhost:3002/node_modules/#angular/compiler/bundles/compiler.umd.js:25647:19)
at createResult (http://localhost:3002/node_modules/#angular/compiler/bundles/compiler.umd.js:25532:19)
at ZoneDelegate.invoke (http://localhost:3002/node_modules/zone.js/dist/zone.js:391:26)
at Zone.run (http://localhost:3002/node_modules/zone.js/dist/zone.js:141:43)
at http://localhost:3002/node_modules/zone.js/dist/zone.js:818:57
at resolvePromise (http://localhost:3002/node_modules/zone.js/dist/zone.js:770:31)
at resolvePromise (http://localhost:3002/node_modules/zone.js/dist/zone.js:741:17)
at http://localhost:3002/node_modules/zone.js/dist/zone.js:818:17
at ZoneDelegate.invokeTask (http://localhost:3002/node_modules/zone.js/dist/zone.js:424:31)
at Zone.runTask (http://localhost:3002/node_modules/zone.js/dist/zone.js:191:47)
at drainMicroTaskQueue (http://localhost:3002/node_modules/zone.js/dist/zone.js:584:35)
at XMLHttpRequest.ZoneTask.invoke (http://localhost:3002/node_modules/zone.js/dist/zone.js:490:25)
I don't know whats going on but I followed the steps in angular material design autocomplete component but it seems not working to me.
Does anyone knows how to fix this issue? And can someone help me with my code? I'm newbie working for fixing this issue for almost 3 hours right now.
Thanks and have a great day!
import FormsModule, ReactiveFormsModule from #angular/forms like below
import { BrowserModule } from '#angular/platform-browser';
import { NgModule } from '#angular/core';
import { FormsModule, ReactiveFormsModule } from '#angular/forms';
#NgModule({
declarations: [
AppComponent
],
imports: [
BrowserModule,
FormsModule,
ReactiveFormsModule
],
providers: [],
bootstrap: [AppComponent]
})
export class AppModule { }

Angular4: Node is throwing a reference error: navigator is not defined when I add <md-sidenav>

I'm using Angular 4 and angular/material. MdToolbar works fine, but when I add MdSidenav to my app template just like the documentation states Node gives me a ReferenceError: navigator is not defined. anyone experience anything similar?
src/app.component.html
<md-sidenav-container>
<layout-header>
<nav-bar></nav-bar>
<!-- TODO: Create nav component -->
<a routerLink="/">Home</a>
<a routerLink="/about">About</a>
<a routerLink="/lazy">Lazy</a>
<a routerLink="/lazy2">Lazy 2</a>
<a routerLink="/user-profile">User Profile</a>
<a routerLink="/test-rest">Test Rest</a>
<a routerLink="/test-route-params">Test Route Params</a>
</layout-header>
<md-sidenav #sidenav class="sidenav">
<ul>
<li>Search</li>
<li>Start a Group</li>
<li>App Settings</li>
<li>About</li>
<li>Help</li>
<li>Logout</li>
</ul>
</md-sidenav>
<!--primary router outlet: a dynamic component that the router uses to
display-->
<router-outlet></router-outlet>
<!-- TODO: Issue with event not emitting via onShown/onHidden -->
<!-- Ref: https://github.com/valor-software/ngx-bootstrap/issues/1886 -->
<app-dialog (dynamicComponent)="onDialogLoad($event)" (onShown)="test()"
(onHidden)="test2()"></app-dialog>
<!--TODO: example; Delete-->
<button (click)="create()">Create</button>
<simple-notifications [options]="options"></simple-notifications>
<layout-footer></layout-footer>
</md-sidenav-container>
src/app.module.ts
#NgModule({
imports: [
CommonModule,
FormsModule,
ReactiveFormsModule,
HttpModule,
TransferHttpModule,
NgReduxModule,
MdToolbarModule,
MdSidenavModule,
MdIconModule,
MdCardModule,
MdInputModule,
MdButtonModule,
DialogModule.forRoot([LoginForm]),
SimpleNotificationsModule.forRoot(), // TODO: remove; testing only
RouterModule.forRoot(AppRoutes)
],
providers: [ AuthGuard, DialogService ],
declarations: [
AppComponent,
HomeView,
AboutComponent,
HeaderComponent,
FooterComponent,
NavBarComponent,
LoginForm,
SideNavComponent
],
exports: [ AppComponent ],
bootstrap : [ AppComponent ]
})
export class AppModule {}
NodeJS error
ERROR { ReferenceError: navigator is not defined
at new Platform (/Users/lsorensen/code/OneUnionV1/node_modules/#angular/material/bundles/material.umd.js:3396:36)
at ServerAppModuleInjector.get (ng:///ServerAppModule/module.ngfactory.js:177:61)
at ServerAppModuleInjector.get (ng:///ServerAppModule/module.ngfactory.js:182:120)
at ServerAppModuleInjector.get (ng:///ServerAppModule/module.ngfactory.js:187:108)
at ServerAppModuleInjector.getInternal (ng:///ServerAppModule/module.ngfactory.js:477:56)
at ServerAppModuleInjector.NgModuleInjector.get (/Users/lsorensen/code/OneUnionV1/node_modules/#angular/core/bundles/core.umd.js:3563:44)
at resolveDep (/Users/lsorensen/code/OneUnionV1/node_modules/#angular/core/bundles/core.umd.js:10931:45)
at createClass (/Users/lsorensen/code/OneUnionV1/node_modules/#angular/core/bundles/core.umd.js:10795:147)
at createDirectiveInstance (/Users/lsorensen/code/OneUnionV1/node_modules/#angular/core/bundles/core.umd.js:10628:37)
at createViewNodes (/Users/lsorensen/code/OneUnionV1/node_modules/#angular/core/bundles/core.umd.js:11978:49)
at callViewAction (/Users/lsorensen/code/OneUnionV1/node_modules/#angular/core/bundles/core.umd.js:12348:13)
at execComponentViewsAction (/Users/lsorensen/code/OneUnionV1/node_modules/#angular/core/bundles/core.umd.js:12287:13)
at createViewNodes (/Users/lsorensen/code/OneUnionV1/node_modules/#angular/core/bundles/core.umd.js:12005:5)
at createRootView (/Users/lsorensen/code/OneUnionV1/node_modules/#angular/core/bundles/core.umd.js:11883:5)
at Object.createProdRootView [as createRootView] (/Users/lsorensen/code/OneUnionV1/node_modules/#angular/core/bundles/core.umd.js:12461:12)
at ComponentFactory_.create (/Users/lsorensen/code/OneUnionV1/node_modules/#angular/core/bundles/core.umd.js:9819:46)
at ComponentFactoryBoundToModule.create (/Users/lsorensen/code/OneUnionV1/node_modules/#angular/core/bundles/core.umd.js:3434:29)
at ApplicationRef_.bootstrap (/Users/lsorensen/code/OneUnionV1/node_modules/#angular/core/bundles/core.umd.js:5016:57)
at /Users/lsorensen/code/OneUnionV1/node_modules/#angular/core/bundles/core.umd.js:4803:79
at Array.forEach (native)
at PlatformRef_._moduleDoBootstrap (/Users/lsorensen/code/OneUnionV1/node_modules/#angular/core/bundles/core.umd.js:4803:42)
at /Users/lsorensen/code/OneUnionV1/node_modules/#angular/core/bundles/core.umd.js:4765:27
at ZoneDelegate.invoke (/Users/lsorensen/code/OneUnionV1/node_modules/zone.js/dist/zone-node.js:365:26)
at Object.onInvoke (/Users/lsorensen/code/OneUnionV1/node_modules/#angular/core/bundles/core.umd.js:4132:37)
at ZoneDelegate.invoke (/Users/lsorensen/code/OneUnionV1/node_modules/zone.js/dist/zone-node.js:364:32)
at Zone.run (/Users/lsorensen/code/OneUnionV1/node_modules/zone.js/dist/zone-node.js:125:43)
at /Users/lsorensen/code/OneUnionV1/node_modules/zone.js/dist/zone-node.js:758:57
Just exporting MdSidenavModule from NgModule might do the trick in your case.
I had luck breaking out the Material modules(the ones used across multiple components) into their own module, which cleaned up app.module a bit. Then did an import AND export in app.module, something like this:
material.module.ts
import { MdSidenavModule } from '#angular/material';
.
.
const MATERIAL_MODULES = [
MdSidenavModule,
.
.
];
#NgModule({
imports: MATERIAL_MODULES,
exports: MATERIAL_MODULES
})
export class MaterialModule { }
app.module
import { MaterialModule } from '../material.module';
.
.
#NgModule({
imports: [
MaterialModule,
.
.
],
exports: [ MaterialModule ],
})

Resources