Angular material 6.3.0 stop to work on build prod

[Toso82]

Bug, feature request, or proposal:

Stop to working on:

ng serve --prod

in ng serve work well

The application start with this error:

main.3cea331738aacf3015b8.js:1 ERROR Error: StaticInjectorError(Os)[t -> t]: 
  StaticInjectorError(Platform: core)[t -> t]: 
    NullInjectorError: No provider for t!
    at t.get (main.3cea331738aacf3015b8.js:1)
    at main.3cea331738aacf3015b8.js:1
    at t (main.3cea331738aacf3015b8.js:1)
    at t.get (main.3cea331738aacf3015b8.js:1)
    at main.3cea331738aacf3015b8.js:1
    at t (main.3cea331738aacf3015b8.js:1)
    at t.get (main.3cea331738aacf3015b8.js:1)
    at bi (main.3cea331738aacf3015b8.js:1)
    at t.get (main.3cea331738aacf3015b8.js:1)
    at so (main.3cea331738aacf3015b8.js:1)
le @ main.3cea331738aacf3015b8.js:1
main.3cea331738aacf3015b8.js:1 Error: StaticInjectorError(Os)[t -> t]: 
  StaticInjectorError(Platform: core)[t -> t]: 
    NullInjectorError: No provider for t!
    at t.get (main.3cea331738aacf3015b8.js:1)
    at main.3cea331738aacf3015b8.js:1
    at t (main.3cea331738aacf3015b8.js:1)
    at t.get (main.3cea331738aacf3015b8.js:1)
    at main.3cea331738aacf3015b8.js:1
    at t (main.3cea331738aacf3015b8.js:1)
    at t.get (main.3cea331738aacf3015b8.js:1)
    at bi (main.3cea331738aacf3015b8.js:1)
    at t.get (main.3cea331738aacf3015b8.js:1)
    at so (main.3cea331738aacf3015b8.js:1)
main.3cea331738aacf3015b8.js:1 ERROR TypeError: Cannot read property 'instance' of undefined
    at Li (main.3cea331738aacf3015b8.js:1)
    at Object.handleEvent (main.3cea331738aacf3015b8.js:1)
    at Object.handleEvent (main.3cea331738aacf3015b8.js:1)
    at Object.handleEvent (main.3cea331738aacf3015b8.js:1)
    at Br (main.3cea331738aacf3015b8.js:1)
    at main.3cea331738aacf3015b8.js:1
    at main.3cea331738aacf3015b8.js:1
    at e.invokeTask (polyfills.7a0e6866a34e280f48e7.js:1)
    at Object.onInvokeTask (main.3cea331738aacf3015b8.js:1)
    at e.invokeTask (polyfills.7a0e6866a34e280f48e7.js:1)
le @ main.3cea331738aacf3015b8.js:1

Which versions of Angular, Material, OS, TypeScript, browsers are affected?

Angular CLI: 6.0.7
Node: 10.3.0
OS: win32 x64
Angular: 6.0.5
... animations, common, compiler, compiler-cli, core, forms
... http, language-service, platform-browser
... platform-browser-dynamic, router

Package                           Version
-----------------------------------------------------------
@angular-devkit/architect         0.6.8
@angular-devkit/build-angular     0.6.8
@angular-devkit/build-optimizer   0.6.8
@angular-devkit/core              0.6.8
@angular-devkit/schematics        0.7.0-beta.1
@angular/cdk                      6.3.0
@angular/flex-layout              6.0.0-beta.16
@angular/material                 6.3.0
@ngtools/webpack                  6.0.8
@schematics/angular               0.6.7 (cli-only)
@schematics/update                0.6.7 (cli-only)
rxjs                              6.2.1
typescript                        2.7.2
webpack                           4.8.3

Is there anything else we should know?

if i try:

ng serve --prod --optimization=false

Give me this error:

ERROR Error: StaticInjectorError(AppModule)[AppComponent -> MatSnackBar]: 
  StaticInjectorError(Platform: core)[AppComponent -> MatSnackBar]: 
    NullInjectorError: No provider for MatSnackBar!
    at NullInjector.push../node_modules/@angular/core/fesm5/core.js.NullInjector.get (main.1671513801bff42a5980.js:31078)
    at resolveToken (main.1671513801bff42a5980.js:31328)
    at tryResolveToken (main.1671513801bff42a5980.js:31273)
    at StaticInjector.push../node_modules/@angular/core/fesm5/core.js.StaticInjector.get (main.1671513801bff42a5980.js:31168)
    at resolveToken (main.1671513801bff42a5980.js:31328)
    at tryResolveToken (main.1671513801bff42a5980.js:31273)
    at StaticInjector.push../node_modules/@angular/core/fesm5/core.js.StaticInjector.get (main.1671513801bff42a5980.js:31168)
    at resolveNgModuleDep (main.1671513801bff42a5980.js:38109)
    at NgModuleRef_.push../node_modules/@angular/core/fesm5/core.js.NgModuleRef_.get (main.1671513801bff42a5980.js:38801)
    at resolveDep (main.1671513801bff42a5980.js:39167)
defaultErrorLogger @ main.1671513801bff42a5980.js:31671
push../node_modules/@angular/core/fesm5/core.js.ErrorHandler.handleError @ main.1671513801bff42a5980.js:31719
(anonymous) @ main.1671513801bff42a5980.js:34368
push../node_modules/zone.js/dist/zone.js.ZoneDelegate.invoke @ polyfills.f506ff5bbe08fb3ba254.js:2710
push../node_modules/zone.js/dist/zone.js.Zone.run @ polyfills.f506ff5bbe08fb3ba254.js:2460
push../node_modules/@angular/core/fesm5/core.js.NgZone.runOutsideAngular @ main.1671513801bff42a5980.js:33739
(anonymous) @ main.1671513801bff42a5980.js:34368
push../node_modules/zone.js/dist/zone.js.ZoneDelegate.invoke @ polyfills.f506ff5bbe08fb3ba254.js:2710
onInvoke @ main.1671513801bff42a5980.js:33780
push../node_modules/zone.js/dist/zone.js.ZoneDelegate.invoke @ polyfills.f506ff5bbe08fb3ba254.js:2709
push../node_modules/zone.js/dist/zone.js.Zone.run @ polyfills.f506ff5bbe08fb3ba254.js:2460
(anonymous) @ polyfills.f506ff5bbe08fb3ba254.js:3194
push../node_modules/zone.js/dist/zone.js.ZoneDelegate.invokeTask @ polyfills.f506ff5bbe08fb3ba254.js:2743
onInvokeTask @ main.1671513801bff42a5980.js:33771
push../node_modules/zone.js/dist/zone.js.ZoneDelegate.invokeTask @ polyfills.f506ff5bbe08fb3ba254.js:2742
push../node_modules/zone.js/dist/zone.js.Zone.runTask @ polyfills.f506ff5bbe08fb3ba254.js:2510
drainMicroTaskQueue @ polyfills.f506ff5bbe08fb3ba254.js:2917
Promise.then (async)
scheduleMicroTask @ polyfills.f506ff5bbe08fb3ba254.js:2900
push../node_modules/zone.js/dist/zone.js.ZoneDelegate.scheduleTask @ polyfills.f506ff5bbe08fb3ba254.js:2732
onScheduleTask @ polyfills.f506ff5bbe08fb3ba254.js:2619
push../node_modules/zone.js/dist/zone.js.ZoneDelegate.scheduleTask @ polyfills.f506ff5bbe08fb3ba254.js:2723
push../node_modules/zone.js/dist/zone.js.Zone.scheduleTask @ polyfills.f506ff5bbe08fb3ba254.js:2554
push../node_modules/zone.js/dist/zone.js.Zone.scheduleMicroTask @ polyfills.f506ff5bbe08fb3ba254.js:2574
scheduleResolveOrReject @ polyfills.f506ff5bbe08fb3ba254.js:3184
ZoneAwarePromise.then @ polyfills.f506ff5bbe08fb3ba254.js:3284
push../node_modules/@angular/core/fesm5/core.js.ApplicationInitStatus.runInitializers @ main.1671513801bff42a5980.js:33034
(anonymous) @ main.1671513801bff42a5980.js:34273
_callAndReportToErrorHandler @ main.1671513801bff42a5980.js:34365
(anonymous) @ main.1671513801bff42a5980.js:34271
push../node_modules/zone.js/dist/zone.js.ZoneDelegate.invoke @ polyfills.f506ff5bbe08fb3ba254.js:2710
onInvoke @ main.1671513801bff42a5980.js:33780
push../node_modules/zone.js/dist/zone.js.ZoneDelegate.invoke @ polyfills.f506ff5bbe08fb3ba254.js:2709
push../node_modules/zone.js/dist/zone.js.Zone.run @ polyfills.f506ff5bbe08fb3ba254.js:2460
push../node_modules/@angular/core/fesm5/core.js.NgZone.run @ main.1671513801bff42a5980.js:33694
push../node_modules/@angular/core/fesm5/core.js.PlatformRef.bootstrapModuleFactory @ main.1671513801bff42a5980.js:34262
./src/main.ts @ main.1671513801bff42a5980.js:207374
__webpack_require__ @ runtime.8c26f1fab6959b00a997.js:77
0 @ main.1671513801bff42a5980.js:207388
__webpack_require__ @ runtime.8c26f1fab6959b00a997.js:77
checkDeferredModules @ runtime.8c26f1fab6959b00a997.js:44
webpackJsonpCallback @ runtime.8c26f1fab6959b00a997.js:31
(anonymous) @ main.1671513801bff42a5980.js:1
main.1671513801bff42a5980.js:207375 Error: StaticInjectorError(AppModule)[AppComponent -> MatSnackBar]: 
  StaticInjectorError(Platform: core)[AppComponent -> MatSnackBar]: 
    NullInjectorError: No provider for MatSnackBar!
    at NullInjector.push../node_modules/@angular/core/fesm5/core.js.NullInjector.get (main.1671513801bff42a5980.js:31078)
    at resolveToken (main.1671513801bff42a5980.js:31328)
    at tryResolveToken (main.1671513801bff42a5980.js:31273)
    at StaticInjector.push../node_modules/@angular/core/fesm5/core.js.StaticInjector.get (main.1671513801bff42a5980.js:31168)
    at resolveToken (main.1671513801bff42a5980.js:31328)
    at tryResolveToken (main.1671513801bff42a5980.js:31273)
    at StaticInjector.push../node_modules/@angular/core/fesm5/core.js.StaticInjector.get (main.1671513801bff42a5980.js:31168)
    at resolveNgModuleDep (main.1671513801bff42a5980.js:38109)
    at NgModuleRef_.push../node_modules/@angular/core/fesm5/core.js.NgModuleRef_.get (main.1671513801bff42a5980.js:38801)
    at resolveDep (main.1671513801bff42a5980.js:39167)

The same code work well with old version.

[steveandrews01]

I have exactly the same issue with MatBottomSheet - 'No provider for MatBottomSheet'. I've gone back to the previous version for now.

[fdeniz]

same here

[jelbourn]

I've set the latest tag on npm back to 6.2.1 while investigating this.

I ran into this as well while deploying material.angular.io and was able to fix it by doing a fresh install/build, so I assumed it was just an environment issue. However, with so many people running into it, it seems something is amiss.

[jelbourn]

Is someone able to share a project with a reproduction? I can't seem to reproduce it with material.angular.io any more.

[kdubious]

I tried to recreate and couldn't. So I deleted the:
@angular, @angular-devkit, rxjs, rxjs-compat
folders from node_modules, then ran:
npm install
and it seems that the issue is resolved.

I've been using ng update, since v5? in case that's useful. I'm now on the following:

"@angular/animations": "^6.0.5",
"@angular/cdk": "^6.3.0",
"@angular/common": "^6.0.5",
"@angular/compiler": "^6.0.5",
"@angular/compiler-cli": "^6.0.5",
"@angular/core": "^6.0.5",
"@angular/flex-layout": "^6.0.0-beta.15",
"@angular/forms": "^6.0.5",
"@angular/http": "^6.0.5",
"@angular/material": "^6.3.0",
"@angular/platform-browser": "^6.0.5",
"@angular/platform-browser-dynamic": "^6.0.5",
"@angular/platform-server": "6.0.5",
"@angular/router": "^6.0.5",

[fad250]

I just updated to version 6.3.0 and I dont have this issue. It worked perfectly!

Package                           Version
-----------------------------------------------------------
@angular-devkit/architect         0.6.7
@angular-devkit/build-angular     0.6.7
@angular-devkit/build-optimizer   0.6.7
@angular-devkit/core              0.6.7
@angular-devkit/schematics        0.6.7
@angular/cdk                      6.3.0
@angular/cli                      6.0.7
@angular/flex-layout              6.0.0-beta.15
@angular/material                 6.3.0
@angular/pwa                      0.7.0-beta.1
@ngtools/webpack                  6.0.7
@schematics/angular               0.6.7
@schematics/update                0.6.7
rxjs                              6.2.0
typescript                        2.7.2
webpack                           4.8.3

[jelbourn]

Can anyone answer whether the issue goes away if you update @angular/cli and @angular-devkit/build-angular to the latest versions?

[fdeniz]

Updating @angular/cli and @angular-devkit/build-angular solved my problem, thank you Jeremy!

[bampakoa]

I am using an ejected project with Angular CLI 1.7.4 and the problems seems to be present on 6.3.0 but not on 6.2.1. By the way, I am using Angular 6.0.7.

[jelbourn]

@josephperrott and I have spent a while debugging this now, and we're relatively sure this is caused by some bug in @angular/cli, specifically the build-optimizer. In and environment where we're able to reproduce the issue, running with --build-optimizer=false works fine. We'e not able to reproduce it at all with the most recently released versions of the cli and devkit.

So, to resolve this, you should:

• Update to the latest versions for @angular/cli and @angular-devkit (updating the other @angular packages probably wouldn't hurt)
• Clear your node_modules and do a fresh install