'@angular/fire/firestore'. CommonJS or AMD dependencies can cause optimization bailouts. Firebase 8

[alexis-mrc]

All my dependencies :

    "@angular/animations": "^10.2.0",
    "@angular/cdk": "^10.2.5",
    "@angular/common": "^10.2.0",
    "@angular/compiler": "^10.2.0",
    "@angular/core": "^10.2.0",
    "@angular/fire": "^6.0.4",
    "@angular/flex-layout": "^10.0.0-beta.32",
    "@angular/forms": "^10.2.0",
    "@angular/material": "^10.2.5",
    "@angular/platform-browser": "^10.2.0",
    "@angular/platform-browser-dynamic": "^10.2.0",
    "@angular/platform-server": "^10.2.0",
    "@angular/router": "^10.2.0",
    "@datorama/akita": "^5.2.5",
    "@datorama/akita-ng-router-store": "^5.1.8",
    "@ngneat/until-destroy": "^8.0.3",
    "@nguniversal/express-engine": "^10.1.0",
    "akita-ng-fire": "^3.1.7",
    "canvas": "^2.6.1",
    "core-js": "^3.1.4",
    "firebase": "^8.0.1",
    "lunr": "^2.3.9",
    "ng-katex": "^2.0.3",
    "ng-lazyload-image": "^9.0.1",
    "ngx-color": "^6.0.1",
    "ngx-cookie-service": "^10.0.1",
    "ngx-quicklink": "^0.2.4",
    "rxjs": "~6.6.3",
    "tslib": "^1.10.0",
    "undefined": "^0.1.0",
    "zone.js": "~0.10.2"

Expected behavior

Not getting message about commonjs during the build

Actual behavior

applications-suite.module.ts depends on '@angular/fire/firestore'. CommonJS or AMD dependencies can cause optimization bailouts.

My applications-suite.module.ts

import { NgModule } from '@angular/core';
import { CommonModule } from '@angular/common';
import {ApplicationsSuiteComponent} from './applications-suite.component';
import { MatButtonModule } from '@angular/material/button';
import { MatIconModule } from '@angular/material/icon';
import { MatSidenavModule } from '@angular/material/sidenav';
import {LayoutModule} from '@angular/cdk/layout';
import {ApplicationsSuiteRoutingModule} from './applications-suite-routing.module';
import {SuiteNavbarModule} from './suite-navbar/suite-navbar.module';
import {LegalModule} from '../../shared/legal/legal.module';
import {AngularFirestoreModule} from '@angular/fire/firestore';

@NgModule({
  declarations: [
    ApplicationsSuiteComponent,
  ],
  imports: [
    CommonModule,
    AngularFirestoreModule,
    ApplicationsSuiteRoutingModule,
    MatSidenavModule,
    MatButtonModule,
    MatIconModule,
    LayoutModule,
    SuiteNavbarModule,
    LegalModule,
  ]
})
export class ApplicationsSuiteModule { }

By updating to Firebase 8 and @angular/fire 6.0.4, I remove all firebase and @angular/fire from allowedCommonJsDependencies.

[jamesdaniels]

Per the comment here, it seems like this is a false positive with ngcc https://github.com/angular/angularfire/issues/2565#issuecomment-723363496

[jamesdaniels]

Pinning since a lot of folk are running into this.

[jamesdaniels]

This now seems to be fully resolved with the latest versions. Closing and unpinning.