Это мое последнее средство после нескольких часов настройки собственного AOT в проекте Angular 7 без CLI и отладки, я получил
Uncaught Error: StaticInjectorError(Platform: core)[function(){}]:
NullInjectorError: No provider for function(){}!
at t.get (injector.ts:43)
at injector.ts:346
at Xa (injector.ts:288)
at t.get (injector.ts:168)
at Cp (application_ref.ts:41)
at t.bootstrapModule (application_ref.ts:262)
at Object.<anonymous> (main-aot.ts:14)
at n (bootstrap:19)
at bootstrap:83
at bootstrap:83
Это мой app.module.ts
import { AppComponent } from './app.component';
import { NgModule } from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';
import { HttpClient, HttpClientModule } from '@angular/common/http';
import { InlineSVGModule } from 'ng-inline-svg';
import { APP_BASE_HREF } from '@angular/common';
import { TranslateModule, TranslateLoader } from '@ngx-translate/core';
import { FeatureRoutingModule } from './app-routing.module';
/**
* Core
*/
import { HeaderComponent } from './core/header/header.component';
import { AppSettingsComponent } from './core/header/app-settings/app-settings.component';
import { SidebarComponent } from './core/sidebar/sidebar.component';
import { PreloaderComponent } from './core/preloader/preloader.component';
import { TranslationLoader } from './services/translation.service';
/**
* Shared
*/
import { PopupsDirective } from './shared/popups/popups.directive';
/**
* Component
*/
import { StructureComponent } from './component/structure/structure.component';
import { OverviewComponent } from './component/overview/overview.component';
import { MainContentComponent } from './component/main-content/main-content.component';
import { NavigationStripeComponent } from './component/main-content/navigation-stripe/navigation-stripe.component';
import { TestDirective } from './component/tooltip/serviceCalls.directive';
import { TooltipService } from './component/tooltip/tooltip.service';
import { TooltipComponent } from './component/tooltip/tooltip.component';
export function HttpLoaderFactory(http: HttpClient) {
return new TranslationLoader(http);
}
@NgModule({
// rendering in browser environment
imports: [
BrowserModule,
FeatureRoutingModule,
TranslateModule.forRoot({
loader: {
provide: TranslateLoader,
useFactory: (HttpLoaderFactory),
deps: [HttpClient]
}
}),
InlineSVGModule.forRoot(),
HttpClientModule
],
// register services at root level
providers: [
TooltipService,
{ provide: APP_BASE_HREF, useValue: `${window['_app_base']}/` || '/' }
],
// components declarations
declarations: [
AppComponent,
HeaderComponent,
AppSettingsComponent,
SidebarComponent,
PreloaderComponent,
StructureComponent,
OverviewComponent,
MainContentComponent,
TestDirective,
TooltipComponent,
PreloaderComponent,
PopupsDirective,
NavigationStripeComponent
],
// bootstrap component
bootstrap: [AppComponent]
})
export class AppModule {
}
Это мой компонент
import { Component, OnInit } from '@angular/core';
import { AppService } from './services/app.service';
import { TranslateService } from '@ngx-translate/core';
@Component({
selector: 'kpi-main',
templateUrl: './app.component.html'
})
export class AppComponent implements OnInit {
theme: string;
sidebarPref: object = {};
stickyHeader: string = '';
user: object = {};
constructor (private appService: AppService, private translate: TranslateService) {
// this language will be used as a fallback when a translation isn't found in the current language
translate.setDefaultLang('en');
// the lang to use, if the lang isn't available, it will use the current loader to get them
translate.use('en');
}
ngOnInit(): void {
this.appService.getLayoutPreferences().subscribe(layout => {
this.theme = layout.theme.value;
this.sidebarPref = layout.sidebar_small;
this.stickyHeader = layout.stickyHeader.visible;
this.user = layout.sidebar_small.user;
});
}
}
, и мой сервис
import { Injectable } from '@angular/core';
import { HttpClient } from '@angular/common/http';
import { Response } from '@angular/http';
import { Observable } from 'rxjs';
@Injectable({
providedIn: 'root'
})
export class AppService {
theme: string = '';
constructor (private http: HttpClient) { }
setSidebarPref(obj: object): Observable<any> {
return this.http.put('../api/v1.0/users/me/preferences', { 'batch' : obj }, { withCredentials: true } );
}
getUserImage(): Observable<any> {
return this.http.get('../api/v1.0/users/me/image', { responseType: 'blob', withCredentials: true });
}
getLayoutPreferences(): Observable<any> {
return this.http.get('../api/v1.0/properties/layout', { withCredentials: true });
}
handleError(error: Response) {
console.log(error);
return Observable.throw(error.json().error || 'Server error');
}
}
Этот код в моем приложении, я получаю исключение Null-инжектор, которое вы видели в ссылке навершина моего вопроса.И эта ошибка выдается только при работе в производственном режиме (я отключил UglifyJsPlugin, чтобы получить лучшее сообщение об ошибке, но до сих пор неясно, что не так)
Может кто-нибудь сказать мне, что мне не хватает в моих файлах по порядкуиметь успешную конфигурацию службы?
PS: Дайте мне знать, если вам нужны дополнительные файлы для проверки.
Обновление После некоторого поиска я обнаружил, что проблема заключается вв моем файле main-aot.ts и способ создания ngfactory.Это моя новая отправная точка, и вот файл
import 'core-js/es7/reflect';
import 'zone.js/dist/zone';
import { platformBrowser } from '@angular/platform-browser';
import { AppModule } from './app/app.module';
/**
* Enable production mode. Disable Angular's development mode, which turns off assertions and other
* checks within the framework.
*/
import { enableProdMode } from '@angular/core';
// enable production mode and thus disable debugging information
enableProdMode();
platformBrowser().bootstrapModule(<any>AppModule)
.catch(err => console.error(err));