FirebaseUI-Angular icon indicating copy to clipboard operation
FirebaseUI-Angular copied to clipboard

Problem setting up the package

Open Amnish04 opened this issue 1 year ago • 0 comments

I followed the instructions in README to setup this package for my Angular 16 project.

But for some reason I get this error image

This is my configuration.

app.module.ts

import { MatIconModule } from '@angular/material/icon';
import { NgModule } from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';

import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
import { AppComponent } from './app.component';
import { AppRoutingModule } from './routing/app-routing.module';

import { MatButtonModule } from '@angular/material/button';
import { MatTooltipModule } from '@angular/material/tooltip';
import { MatDividerModule } from '@angular/material/divider';
import { MatRippleModule } from '@angular/material/core';
import { HeaderComponent } from './components/header/header.component';
import { LandingPageComponent } from './pages/landing-page/landing-page.component';
import { LoginComponent } from './components/login/login.component';
import { AngularFireModule } from '@angular/fire/compat';
import { environment } from 'src/environments/environment';
import {
    AngularFireAuthModule,
    USE_EMULATOR as USE_AUTH_EMULATOR,
} from '@angular/fire/compat/auth';
import { firebase, firebaseui, FirebaseUIModule } from 'firebaseui-angular';

export const firebaseUiAuthConfig: firebaseui.auth.Config = {
    signInFlow: 'popup',
    signInOptions: [
        {
            requireDisplayName: false,
            provider: firebase.auth.EmailAuthProvider.PROVIDER_ID,
        },
        firebase.auth.GoogleAuthProvider.PROVIDER_ID,
    ],
    //term of service
    tosUrl: '<your-tos-link>',
    //privacy url
    privacyPolicyUrl: '<your-privacyPolicyUrl-link>',
    //credentialHelper:             firebaseui.auth.CredentialHelper.ACCOUNT_CHOOSER_COM

    credentialHelper: firebaseui.auth.CredentialHelper.NONE,
};

const FirebaseModules = [
    AngularFireModule.initializeApp(environment.firebaseConfig),
    AngularFireAuthModule,
    FirebaseUIModule.forRoot(firebaseUiAuthConfig),
];

@NgModule({
    declarations: [
        AppComponent,
        HeaderComponent,
        LandingPageComponent,
        LoginComponent,
    ],
    imports: [
        BrowserModule,
        AppRoutingModule,
        BrowserAnimationsModule,
        MatButtonModule,
        MatIconModule,
        MatTooltipModule,
        MatDividerModule,
        MatRippleModule,
        ...FirebaseModules,
    ],
    providers: [
        {
            provide: USE_AUTH_EMULATOR,
            useValue: !environment.production ? ['localhost', 9099] : undefined,
        },
    ],
    bootstrap: [AppComponent],
})
export class AppModule {}

Amnish04 avatar Jan 29 '24 20:01 Amnish04