ERROR : "NullInjectorError: No provider for NgZone!" when import a library.
See original GitHub issueBug Report or Feature Request (mark with an x
)
- [x] bug report -> please search issues before submitting
- [ ] feature request
Command (mark with an x
)
- [ ] new
- [ ] build
- [ ] serve
- [ ] test
- [ ] e2e
- [x] generate
- [ ] add
- [ ] update
- [ ] lint
- [ ] xi18n
- [ ] run
- [ ] config
- [ ] help
- [ ] version
- [ ] doc
Versions
node v10.8.0 npm 6.2.0 os win10 angular 6.1.2
Repro steps
1.run commands: ng new mylib-demo, cd mylib-demo, ng generate library mylib 2.cd projects/mylib/src/lib ,edit mylib.module.ts, imports BrowserModule. 3.cd …/…/…/…/, ng build mylib, npm link dist/mylib 4.ng new test-mylib, npm link mylib, edit app.module.ts, imports MylibModule. ng serve -o, then browser console show the error: NullInjectorError: No provider for NgZone!
there is a same issue:
The log given by the failure
1.compiled error: WARNING in …/mylib-demo/node_modules/@angular/core/fesm5/core.js 4996:15-36 Critical dependency: the request of a dependency is an expression
WARNING in …/mylib-demo/node_modules/@angular/core/fesm5/core.js 5008:15-102 Critical dependency: the request of a dependency is an expression i 「wdm」: Compiled with warnings.
2.the browser console error: Error: StaticInjectorError(AppModule)[ApplicationRef -> NgZone]: StaticInjectorError(Platform: core)[ApplicationRef -> NgZone]: NullInjectorError: No provider for NgZone! at NullInjector.push…/node_modules/@angular/core/fesm5/core.js.NullInjector.get (core.js:1062) at resolveToken (core.js:1300) at tryResolveToken (core.js:1244) at StaticInjector.push…/node_modules/@angular/core/fesm5/core.js.StaticInjector.get (core.js:1141) at resolveToken (core.js:1300) at tryResolveToken (core.js:1244) at StaticInjector.push…/node_modules/@angular/core/fesm5/core.js.StaticInjector.get (core.js:1141) at resolveNgModuleDep (core.js:8376) at _createClass (core.js:8429) at _createProviderInstance (core.js:8393)
Desired functionality
Mention any other details that might be useful
1.mylib demo: mylib.module.ts
import { NgModule } from '@angular/core'; import { MylibComponent } from './mylib.component'; import {BrowserModule} from '@angular/platform-browser'; @NgModule({ imports: [ BrowserModule ], declarations: [MylibComponent], exports: [MylibComponent] }) export class MylibModule { }
2.test-mylib: app.module.ts
import { BrowserModule } from '@angular/platform-browser'; import { NgModule } from '@angular/core'; import { AppComponent } from './app.component'; import {MylibModule} from 'mylib'; @NgModule({ declarations: [ AppComponent ], imports: [ BrowserModule, MylibModule ], providers: [], bootstrap: [AppComponent] }) export class AppModule { }
Issue Analytics
- State:
- Created 5 years ago
- Comments:18 (1 by maintainers)
@alan-agius4 ,YES, it works. But it will be
./node_modules/@angular/*
not../
Thank you very mach. When you come to china, I would like to invite you to dinner.BrowserModule
shouldn’t be used in a library. UseCommonModule
intead.BrowserModule
is intended to be used only at an application level and imported in the root module.