Question

CLI：

node -v 6.11.2 
cordova -v 6.5.0
ionic -v 3.9.2

创建仅包含主页的离子选项卡项目（手动删除）：

ionic start demo1 tabs

然后创建两个页面使用cmd：

ionic g page Oneself
ionic g page Setting

这是app.module.ts代码：

＆＃13;

import { NgModule, ErrorHandler } from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';
import { IonicApp, IonicModule, IonicErrorHandler } from 'ionic-angular';
import { MyApp } from './app.component';

import { HomePage } from '../pages/home/home';
import { TabsPage } from '../pages/tabs/tabs';
//import { SettingPage } from "../pages/setting/setting";
//import { OneselfPage } from "../pages/oneself/oneself";

import { StatusBar } from '@ionic-native/status-bar';
import { SplashScreen } from '@ionic-native/splash-screen';

@NgModule({
  declarations: [
    MyApp,
    HomePage,
    TabsPage
  ],
  imports: [
    BrowserModule,
    IonicModule.forRoot(MyApp)
  ],
  bootstrap: [IonicApp],
  entryComponents: [
    MyApp,
    HomePage,
    TabsPage
  ],
  providers: [
    StatusBar,
    SplashScreen,
    {provide: ErrorHandler, useClass: IonicErrorHandler}
  ]
})
export class AppModule {}

＆＃13;

这是oneself.module.ts这样：

＆＃13;

import { NgModule } from '@angular/core';
import { IonicPageModule } from 'ionic-angular';
import { OneselfPage } from './oneself';

@NgModule({
  declarations: [
    OneselfPage,
  ],
  imports: [
    IonicPageModule.forChild(OneselfPage),
  ],
  exports:[
    OneselfPage
  ]

})
export class OneselfPageModule {}

＆＃13;

这是oneself.ts文件代码如下：

＆＃13;

import { Component } from '@angular/core';
import { IonicPage, NavController, NavParams } from 'ionic-angular';

/**
 * Generated class for the OneselfPage page.
 *
 * See http://ionicframework.com/docs/components/#navigation for more info
 * on Ionic pages and navigation.
 */

@IonicPage()
@Component({
  selector: 'page-oneself',
  templateUrl: 'oneself.html',
})
export class OneselfPage {
  constructor(public navCtrl: NavController, public navParams: NavParams) {
  }
  ionViewDidLoad() {
    console.log('ionViewDidLoad OneselfPage');
  }
}

＆＃13;

SettingPage与上面相同;

这是tabs.ts代码：

＆＃13;

import { Component } from '@angular/core';
import { HomePage } from '../home/home';

@Component({
  templateUrl: 'tabs.html'
})
export class TabsPage {

  tab1Root = HomePage;
  tab2Root = "OneselfPage";//class name
  tab3Root = "SettingPage";//class name 
  constructor() {
    
  }
}

＆＃13;

我知道延迟加载有几个关键点，例如声明@ ionpage（），@ ngmodule，IonicPageModule。 ForChild（pageName）...我的代码中有这样的声明，但延迟加载不起作用，错误如下：

这是第一行错误，我不知道它是否与延迟加载有关

event.returnValue is deprecated. Please use the standard event.preventDefault() instead.

以下错误必须与延迟加载有关：

Error {rejection: Error, promise: t, zone: r, task: t, stack: <accessor>, …}
message: "Uncaught (in promise): Error: Cannot find module '../pages/oneself/oneself.module'.
Error: Cannot find module '../pages/oneself/oneself.module'
 at file:///android_asset/www/build/main.js:65357:9
    at t.invoke

参见截屏： https://i.stack.imgur.com/AGTVN.jpg

有人可以帮我回答这个问题吗？

Answer 1

问题解决了，用cnpm安装的cordova离子有问题，不要使用cnpm install，使用npm install，运行延迟加载。

Answer 2

CLI：

run()

我已按照您所描述的内容

node -v 8.2.1
cordova -v 7.0.1
ionic -v 3.9.2

我无法重现您所说的任何错误

ionic start demo1 tabs ionic g page Oneself ionic g page Setting

或

event.returnValue is deprecated. Please use the standard event.preventDefault() instead.

如果您想与my reproduction of your scenario you can do so, hope this helps

进行比较

ionic3 / angular4懒惰负载不工作

2 个答案: