类型 { production: boolean; 上不存在属性“firebase"} [英] Property 'firebase' does not exist on type { production: boolean; }
问题描述
所以我试图在 Firebase 和 Heroku 上构建和部署我的 Angular 4 应用程序以进行生产,但我遇到了如下错误:
So I was trying to build and deploy my Angular 4 app for production on both Firebase and Heroku, but I have come across the error as follows:
/Users/.../... (57,49) 中的错误:属性firebase"不存在在类型'{生产:布尔;}'.
ERROR in /Users/.../... (57,49): Property 'firebase' does not exist on type '{ production: boolean; }'.
当我运行 ng build --prod
时会发生这种情况,并且我的部署服务器运行良好.这是我的 app.module.ts 文件,供参考:
It occurs when I run ng build --prod
, and my deployment servers are working perfectly fine. Here is my app.module.ts file, for reference:
import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { FormsModule } from '@angular/forms';
import { AngularFireModule } from 'angularfire2';
import { AngularFireDatabaseModule } from 'angularfire2/database';
import { Ng2ScrollimateModule } from 'ng2-scrollimate';
import { Ng2PageScrollModule } from 'ng2-page-scroll';
import { HttpModule } from '@angular/http';
import { trigger, state, style, animate, transition, keyframes } from '@angular/animations';
import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
import { environment } from '../environments/environment';
import { AppComponent } from './app.component';
import { LogoComponent } from './logo/logo.component';
import { InfoComponent } from './info/info.component';
import { AboutComponent } from './about/about.component';
import { DividerComponent } from './divider/divider.component';
import { ProficienciesComponent } from './proficiencies/proficiencies.component';
import { ProficiencyComponent } from './proficiency/proficiency.component';
import { PortfolioComponent } from './portfolio/portfolio.component';
import { ProjectComponent } from './project/project.component';
import { ResumeComponent } from './resume/resume.component';
import { FooterComponent } from './footer/footer.component';
import { ContactComponent } from './contact/contact.component';
import { LoadingComponent } from './loading/loading.component';
@NgModule({
declarations: [
AppComponent,
LogoComponent,
InfoComponent,
AboutComponent,
DividerComponent,
ProficienciesComponent,
ProficiencyComponent,
PortfolioComponent,
ProjectComponent,
ResumeComponent,
FooterComponent,
ContactComponent,
LoadingComponent,
],
imports: [
BrowserModule,
FormsModule,
HttpModule,
BrowserAnimationsModule,
AngularFireModule.initializeApp(environment.firebase),
AngularFireDatabaseModule,
Ng2ScrollimateModule,
Ng2PageScrollModule.forRoot(),
],
providers: [],
bootstrap: [AppComponent],
})
export class AppModule {}
environment.prod.ts
export const environment = {
production: true
};
environment.ts
export const environment = {
production: true,
firebase: {
apiKey: '...',
authDomain: 'project.firebaseapp.com',
databaseURL: 'https://project.firebaseio.com',
projectId: 'project',
storageBucket: 'project.appspot.com',
messagingSenderId: '...',
},
};
在搜索了 StackOverflow 和 GitHub 以寻找可能的解决方案之后,似乎没有开发人员遇到过这个确切的错误并发布了他们的发现,所以我想知道是否有人知道如何解决这个问题.提前非常感谢!
After scouring StackOverflow and GitHub for possible solutions, there seem to be no developers who have encountered this exact error and published their findings, so I was wondering whether anyone knows how to go about solving this issue. Thanks so much in advance!
推荐答案
当你运行 ng build --prod
angular-cli 将使用 environment.prod.ts
文件和您的 environment.prod.ts
文件 environment
变量没有 firebase
字段,因此您得到了异常.
When you run ng build --prod
angular-cli will use the environment.prod.ts
file and your environment.prod.ts
files environment
variable doesn't have the firebase
field hence you are getting the exception.
将字段添加到environment.prod.ts
export const environment = {
production: true,
firebase: {
apiKey: '...',
authDomain: 'project.firebaseapp.com',
databaseURL: 'https://project.firebaseio.com',
projectId: 'project',
storageBucket: 'project.appspot.com',
messagingSenderId: '...',
},
};
这篇关于类型 { production: boolean; 上不存在属性“firebase"}的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!