在我的项目中,app.module.ts是主模块,layout.module.ts是子模块。 关于这个错误的有趣之处在于,当我使用命令构建 ng build --prod --aot 并且只是 ng build 它在localhost上正常工作时没有任何error.But每当我们使用java后端在服务器中部署时。它开始显示此错误.. 我使用了懒惰加载......
我的app.module.ts
import { NgModule } from '@angular/core';
import { FormsModule, ReactiveFormsModule } from '@angular/forms';
import { Http, HttpModule } from '@angular/http';
import { DatePipe, DecimalPipe } from '@angular/common';
import { HttpClientModule, HttpClientXsrfModule, HTTP_INTERCEPTORS } from '@angular/common/http';
import { BrowserModule } from '@angular/platform-browser';
import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
import { TranslateLoader, TranslateModule, TranslateService } from '@ngx-translate/core';
import { TranslateHttpLoader } from '@ngx-translate/http-loader';
import { AppRoutingModule } from './app-routing.module';
import { AppComponent } from './app.component';
import { FileExportService } from './shared';
@NgModule({
declarations: [
AppComponent,
],
imports: [
BrowserModule,
BrowserAnimationsModule,
FormsModule,
ReactiveFormsModule,
HttpModule,
HttpClientModule,
HttpClientXsrfModule,
AppRoutingModule,
SharedPipesModule,
NgxPermissionsModule.forChild(),
TranslateModule.forRoot({
loader: {
provide: TranslateLoader,
useFactory: HttpLoaderFactory,
deps: [Http]
}
})
],
providers: [
FileExportService,
{
provide: HTTP_INTERCEPTORS,
useClass: TfmHttpInterceptorService,
multi: true,
}
],
bootstrap: [AppComponent]
})
export class AppModule {
}
我的layout.module.ts
import { NgModule, NO_ERRORS_SCHEMA } from '@angular/core';
import { CommonModule } from '@angular/common';
import { TranslateModule } from '@ngx-translate/core';
import { LayoutRoutingModule } from './layout-routing.module';
import { LayoutComponent } from './layout.component';
import { HeaderComponent, SidebarComponent, QuickaccessComponent } from '../shared';
import { SharedModule } from '../shared/modules/shared.module';
import { jqxMenuComponent } from 'jqwidgets-framework/jqwidgets-ts/angular_jqxmenu';
import { TreeModule } from 'angular-tree-component';
@NgModule({
imports: [
CommonModule,
LayoutRoutingModule,
TranslateModule,
TreeModule,
SharedModule,
],
declarations: [
LayoutComponent,
HeaderComponent,
SidebarComponent,
QuickaccessComponent,
jqxMenuComponent,
],
providers: [
],
entryComponents:[
QuickaccessComponent,
],
schemas: [ NO_ERRORS_SCHEMA ]
})
export class LayoutModule { }
我的package.json是
{
"name": "my-data-processing-system",
"version": "0.0.1",
"license": "MIT",
"scripts": {
"ng": "ng",
"start": "ng serve --ec true --port 4201",
"build": "ng build --prod",
"gitbuild": "ng build --prod --base /start-angular/SB-Admin-BS4-Angular-4/master/dist/",
"test": "ng test",
"lint": "ng lint",
"e2e": "ng e2e"
},
"private": true,
"dependencies": {
"@angular/animations": "^4.3.6",
"@angular/common": "^4.3.6",
"@angular/compiler": "^4.3.6",
"@angular/core": "^4.3.6",
"@angular/forms": "^4.3.6",
"@angular/http": "^4.3.6",
"@angular/platform-browser": "^4.3.6",
"@angular/platform-browser-dynamic": "^4.3.6",
"@angular/router": "^4.3.6",
"@ngx-translate/core": "^7.2.0",
"@ngx-translate/http-loader": "^0.1.0",
"angular-tree-component": "^7.0.1",
"angular2-jwt": "^0.2.3",
"bootstrap": "^4.0.0-beta.2",
"core-js": "^2.5.3",
"file-saver": "^1.3.3",
"font-awesome": "^4.7.0",
"jqwidgets-framework": "^5.6.0",
"json-stable-stringify": "^1.0.1",
"ng-pdf-make": "0.0.2",
"ng2-charts": "^1.6.0",
"ngx-permissions": "^3.2.2",
"pdfmake": "^0.1.35",
"rxjs": "^5.5.6",
"xlsx": "^0.11.19",
"zone.js": "^0.8.20"
},
"devDependencies": {
"@angular/cli": "^1.6.8",
"@angular/compiler-cli": "^4.3.1",
"@angular/language-service": "^4.3.1",
"@types/jasmine": "2.5.45",
"@types/node": "^6.0.101",
"codelyzer": "~3.0.1",
"jasmine-core": "~2.6.2",
"jasmine-spec-reporter": "~4.1.0",
"karma": "^1.7.1",
"karma-chrome-launcher": "~2.1.1",
"karma-cli": "~1.0.1",
"karma-coverage-istanbul-reporter": "^1.4.1",
"karma-jasmine": "^1.1.1",
"karma-jasmine-html-reporter": "^0.2.2",
"protractor": "~5.1.2",
"ts-node": "~3.0.4",
"tslint": "~5.3.2",
"typescript": "~2.5.2"
}
}
my file-export.service.ts
import { Injectable } from '@angular/core';
import { DatePipe, DecimalPipe } from '@angular/common';
import { utils, write, WorkBook } from 'xlsx';
import { saveAs } from 'file-saver';
@Injectable()
export class FileExportService {
constructor(private datePipe: DatePipe,private decimalPipe: DecimalPipe) { }
SaveFile(data,fileName){
saveAs(data,fileName);
}
}
答案 0 :(得分:1)
在我的项目中,app.module.ts
是主模块,layout.module.ts
是子模块。
由于布局模块是子模块,因此请将该模块添加到app.module.ts中:
import { LayoutModule } from 'path to your LayoutModule';
...
@NgModule({
imports: [
...,
LayoutModule
]
从layout.module.ts
中导出组件:
...
entryComponents:[
QuickaccessComponent,
],
schemas: [ NO_ERRORS_SCHEMA ],
exports: [ // Here
LayoutComponent,
HeaderComponent,
SidebarComponent,
QuickaccessComponent,
jqxMenuComponent,
]
还有:
模块 LayoutModule '
声明的意外值 FileExportService
所以还有一些问题:
FileExportService
中没有任何LayoutModule
,所以这可能是问题所在吗?FileExportService
添加到LayoutModule
@ngModule中的 provider 中。我希望这会有所帮助:)