Я создаю систему регистрации пользователей с помощью Google Firebase, я следую этому руководству:
Система регистрации пользователей
ПРИМЕЧАНИЕ
: am using this version "firebase": "^5.5.6",
Когда я запускаю свое приложение, у меня возникают следующие ошибки:
ERROR in src/app/login/login.component.ts(2,10): error TS2305: Module '"C:/Users/jelly/projects/profile/node_modules/angularfire2/index"' has no exported member 'AngularFire'.
src/app/login/login.component.ts(3,28): error TS2305: Module '"C:/Users/jelly/projects/profile/node_modules/angularfire2/firestore/index"' has no exported member 'AuthProviders'.
src/app/login/login.component.ts(3,43): error TS2305: Module '"C:/Users/jelly/projects/profile/node_modules/angularfire2/firestore/index"' has no exported member 'AuthMethods'.
Вот app.modul.ts
import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { FormsModule, ReactiveFormsModule } from '@angular/forms';
import { HttpModule, JsonpModule } from '@angular/http';
import { RouterModule } from '@angular/router';
import { AppRoutingModule } from './app-routing.module';
import { AppComponent } from './app.component';
import { UserProfileComponent } from './user-profile/user-profile.component';
import {HttpClientModule} from '@angular/common/http';
import { UserService } from './service/user.service';
import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
import { NgbModule } from '@ng-bootstrap/ng-bootstrap';
import { MomentModule } from 'ngx-moment';
import { AngularFireModule } from 'angularfire2';
import { AngularFirestoreModule } from 'angularfire2/firestore';
import { LoginComponent } from './login/login.component';
import { EmailComponent } from './email/email.component';
import { SignupComponent } from './signup/signup.component';
import { AngularFireAuthModule } from 'angularfire2/auth';
import { AngularFireDatabaseModule} from 'angularfire2/database';
const firebaseConfig = {
apiKey: '',
authDomain: '',
databaseURL: '',
projectId: '',
storageBucket: '',
messagingSenderId: ''
};
@NgModule({
declarations: [
AppComponent,
UserProfileComponent,
LoginComponent,
EmailComponent,
SignupComponent
],
imports: [
BrowserModule,
AppRoutingModule,
NgbModule,
BrowserModule,
MomentModule,
AppRoutingModule,
BrowserAnimationsModule,
AngularFireAuthModule,
BrowserModule,
AngularFirestoreModule,
AngularFireModule.initializeApp(firebaseConfig),
AngularFireDatabaseModule,
HttpModule,
FormsModule,
HttpClientModule,
ReactiveFormsModule,
RouterModule,
AppRoutingModule,
],
providers: [UserService],
bootstrap: [AppComponent]
})
export class AppModule { }
Вот компонент входа в систему, другие компоненты прямо empyt
import { Component, OnInit } from '@angular/core';
import { AngularFire, } from 'angularfire2';
import { AngularFirestore, AuthProviders, AuthMethods, AngularFirestoreCollection, AngularFirestoreDocument } from 'angularfire2/firestore';
import { Router } from '@angular/router';
@Component({
selector: 'app-login',
templateUrl: './login.component.html',
styleUrls: ['./login.component.scss']
})
export class LoginComponent implements OnInit {
// declare empyt array to hold error data
error: any;
constructor(public af: AngularFire, private router: Router) {
// fucntion to check user authentication
this.af.auth.subscribe(auth => {
if (auth) {
this.router.navigateByUrl('/members');
}
});
}
// function to login in facebook
loginFb() {
this.af.auth.login({
provider: AuthProviders.Facebook,
method: AuthMethods.Popup,
}).then(
(success) => {
this.router.navigate(['/members']);
}).catch(
(err) => {
this.error = this.error;
});
}
// function to login with google
loginGoogle() {
this.af.auth.login({
provider: AuthProviders.Facebook,
method: AuthMethods.Popup,
}).then(
(success) => {
this.router.navigate(['/members']);
}).catch(
(err) => {
this.error = this.error;
});
}
ngOnInit() {
}
}
Я использовал почти все решения для переполнения стека, но ничего не помогло, я собираюсь сдаться, я не вижу хорошей документации по этому поводу, чтобы чайники понимали, что, черт возьми, происходит :(
Что мне нужно изменить, чтобы избавиться от этой ошибки? пожалуйста помоги
@ Jake11 "firebase": "^ 5.5.6",
поэтому версия, которую они использовали в tut, составляет ~ 3.6.5, вы можете попробовать перейти на более раннюю версию, или попробовать следовать примечаниям к выпуску firebase.google.com/support/release-notes/js, чтобы узнать, куда были перемещены эти классы, или просто поищите в документации, где вы можете найти их версию, которая ты используешь.
если вы решите перейти на более раннюю версию, я не уверен, но вам, вероятно, придется также понизить версию angularfire2 до более старой версии
к сожалению, при понижении версии firebase все еще возникают ошибки, и возникает множество других ошибок.
Учебник выпущен 17 января 2017 года, и если вы запустите npm install angularfire2 firebase --save
, у вас будет установлена последняя версия firebase, которая не является той, на которой основан учебник, посмотрите здесь похожий пост по этой проблеме
Таким образом, вам нужно понизить версию firebase, которую вы используете для этого проекта, или обновить импорт, чтобы они указывали на правильные файлы, в которых вы можете найти нужные вам классы.
Джейк Я пробовал весь этот соултон, но ничего не помогло :( вот почему мне нужна была помощь
@ user9964622 а какая у вас версия angularfire2?
"angularfire2": "^ 5.1.0" ,?
@ user9964622 запустите npm remove angularfire2
-> npm install [email protected] --save
-> npm remove firebase
-> npm install [email protected] --save
-> перезапустите приложение -> скажите мне, если ошибка все еще возникает
теперь я получаю эту ошибку: 'subscribe' does not exist on type 'AngularFireAuth'.
обновите весь package.json, чтобы он выглядел так же, как здесь github.com/designcourse/angular-auth-demo/blob/master/…, запустите npm update
и перезапустите проект, попробуйте npm install
, если npm update
не поможет
какой выпуск firebase вы используете?