我是离子框架的新手,刚刚开始.我在Windows上工作.我用这个命令创建了我的应用程序:
ionic start ionic-welcome tabs
ionic serve
Run Code Online (Sandbox Code Playgroud)
我使用下面的命令创建一个新页面
ionic g page welcome
Run Code Online (Sandbox Code Playgroud)
我在我的控制台中得到了这个回复:
[确定]生成一个名为welcome的页面!
更新app.module.ts欢迎页面:
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 { Welcome } from '../pages/welcome/welcome';
import { AboutPage } from '../pages/about/about';
import { ContactPage } from '../pages/contact/contact';
import { HomePage } from '../pages/home/home';
import { TabsPage } from '../pages/tabs/tabs';
import { StatusBar } from '@ionic-native/status-bar';
import { SplashScreen } from '@ionic-native/splash-screen';
@NgModule({
declarations: [
MyApp,
Welcome,
AboutPage,
ContactPage,
HomePage,
TabsPage
],
imports: [
BrowserModule,
IonicModule.forRoot(MyApp)
],
bootstrap: [IonicApp],
entryComponents: [
MyApp,
Welcome,
AboutPage,
ContactPage,
HomePage,
TabsPage
],
providers: [
StatusBar,
SplashScreen,
{provide: ErrorHandler, useClass: IonicErrorHandler}
]
})
export class AppModule {}
Run Code Online (Sandbox Code Playgroud)
但是当我浏览到localhost:8100时,我收到"欢迎页面"的错误.
模块'"C:/ xampp/htdocs/ionic/ionic-welcome/src/pages/welcome/welcome"'没有导出的成员'欢迎'.
的package.json:
{
"name": "ionic-welcome",
"version": "0.0.1",
"author": "Ionic Framework",
"homepage": "http://ionicframework.com/",
"private": true,
"scripts": {
"clean": "ionic-app-scripts clean",
"build": "ionic-app-scripts build",
"lint": "ionic-app-scripts lint",
"ionic:build": "ionic-app-scripts build",
"ionic:serve": "ionic-app-scripts serve"
},
"dependencies": {
"@angular/common": "4.1.3",
"@angular/compiler": "4.1.3",
"@angular/compiler-cli": "4.1.3",
"@angular/core": "4.1.3",
"@angular/forms": "4.1.3",
"@angular/http": "4.1.3",
"@angular/platform-browser": "4.1.3",
"@angular/platform-browser-dynamic": "4.1.3",
"@ionic-native/core": "3.12.1",
"@ionic-native/splash-screen": "3.12.1",
"@ionic-native/status-bar": "3.12.1",
"@ionic/storage": "2.0.1",
"ionic-angular": "3.6.0",
"ionicons": "3.0.0",
"rxjs": "5.4.0",
"sw-toolbox": "3.6.0",
"zone.js": "0.8.12"
},
"devDependencies": {
"@ionic/app-scripts": "2.1.3",
"typescript": "2.3.4"
},
"description": "An Ionic project"
}
Run Code Online (Sandbox Code Playgroud)
小智 9
如果你查看Welcome.ts,你可能会发现这样的事情
export class WelcomePage {
constructor(public navCtrl: NavController, public navParams: NavParams)
{
}
ionViewDidLoad() {
console.log('ionViewDidLoad WelcomePage');
}
Run Code Online (Sandbox Code Playgroud)
在您的app.modules.ts中执行以下操作
import { WelcomePage } from '../pages/welcome/welcome'
Run Code Online (Sandbox Code Playgroud)
然后将WelcomePage添加到声明和entryComponents.
我刚刚面对这个问题,并设法以这种方式解决它.
祝好运