我有很多问题与Ionic 4和延迟加载模块,由于某种原因,它一直报告无法找到下面的登录模块,如果我编辑route.module.ts文件并保存有时它找到它。有人遇到过这个问题而且知道如何修复?
error in app.module.ts Error: Uncaught (in promise): Error: Cannot find module './pages/auth/login/login.module'
Error: Cannot find module './pages/auth/login/login.module'
//主app模块
import { ErrorHandler, NgModule } from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';
import { RouteReuseStrategy } from '@angular/router';
import { IonicModule, IonicRouteStrategy } from '@ionic/angular';
// AoT requires an exported function for factories
export function HttpLoaderFactory(http: HttpClient) {
return new TranslateHttpLoader(http, 'assets/i18n/')
}
class MyErrorHandler implements ErrorHandler {
handleError(error) {
console.log("error in app.module.ts", error);
}
}
@NgModule({
declarations: [AppComponent],
entryComponents: [],
imports: [
BrowserModule,
IonicModule.forRoot(),
AppRoutingModule,
HttpClientModule,
TranslateModule.forRoot({
loader: {
provide: TranslateLoader,
useFactory: HttpLoaderFactory,
deps: [HttpClient]
}
}),
AngularFireModule.initializeApp({
}),
AngularFireDatabaseModule,
// Put your custom imports below this line to make merges in Git easier
FormsModule,
ReactiveFormsModule,
],
providers: [
{provide: ErrorHandler, useClass: MyErrorHandler}, // had to add a custom error handler class here as IonicErrorHandler deprecated -
{ provide: RouteReuseStrategy, useClass: IonicRouteStrategy }
],
bootstrap: [AppComponent]
})
export class AppModule {}
//主路由文件延迟加载无法找到的登录页面
import { NgModule } from '@angular/core';
import { PreloadAllModules, RouterModule, Routes } from '@angular/router';
const routes: Routes = [
{ path: '', redirectTo: 'home', pathMatch: 'full' },
{ path: 'login', loadChildren: './pages/auth/login/login.module#LoginPageModule' },
{ path: 'home', loadChildren: './pages/home/home.module#HomePageModule' },
];
@NgModule({
imports: [
RouterModule.forRoot(routes, { preloadingStrategy: PreloadAllModules })
],
exports: [RouterModule]
})
export class AppRoutingModule { }
//登录懒惰的模块,无法找到
import { NgModule } from '@angular/core';
import { CommonModule } from '@angular/common';
import { FormsModule, ReactiveFormsModule } from '@angular/forms';
import { Routes, RouterModule } from '@angular/router';
import { TranslateModule} from "@ngx-translate/core"
import { IonicModule } from '@ionic/angular';
import { LoginPage } from './login.page';
const routes: Routes = [
{
path: '',
component: LoginPage
}
];
@NgModule({
imports: [
CommonModule,
FormsModule,
IonicModule,
ReactiveFormsModule,
TranslateModule,
RouterModule.forChild(routes)
],
declarations: [LoginPage]
})
export class LoginPageModule {}
您应检查Angular文件夹结构并检查该模块是否具有正确的路径,然后在路径延迟模块具有正确路径时尝试重新加载服务器。
重新启动CLI。
运行ionic serve
(我大多数时候使用ionic serve
,其他人似乎使用ng serve
)。
我注意到CLI需要不时重新启动,尤其是在更改app.module
文件时。
我刚刚通过删除import { AppRoutingModule } from './app-routing.module';
然后让CLI重新编译(此时我得到ERROR Error: StaticInjectorError(AppModule)[IonRouterOutlet -> Router]:
)重新创建了您的错误消息。
当我再次导入AppRoutingModule
并让CLI编译(不重新启动)时,我会收到完全相同的消息;重新启动它,我的项目完全加载。
现在每当我遇到一些愚蠢的错误,我都会重新启动CLI,然后才能在我脑海中划出一个洞。