ionic2 to ionic3 - huang-qing/ionic3-platform GitHub Wiki

ionic2 to ionic3

ionic3 info

$ ionic info

global packages:

@ionic/cli-utils : 1.3.0
Cordova CLI      : 7.0.1
Ionic CLI        : 3.3.0

local packages:

@ionic/app-scripts              : 1.3.7
@ionic/cli-plugin-cordova       : 1.3.0
@ionic/cli-plugin-ionic-angular : 1.3.0
Cordova Platforms               : android 6.2.3
Ionic Framework                 : ionic-angular 3.3.0

System:

Node       : v6.11.0
OS         : Windows 10
Xcode      : not installed
ios-deploy : not installed
ios-sim    : not installed

Upgrade to Ionic 3 Lazy Loading

Ionic 3

$ npm install -g ionic cordova

Ionic 3 package.json

{
  "name": "ionic-hello-world",
  "version": "0.0.0",
  "author": "Ionic Framework",
  "homepage": "http://ionicframework.com/",
  "private": true,
  "config": {
    "ionic_copy": "./custom-icons.config/copy.config.js",
    "ionic_sass": "./custom-icons.config/sass.config.js",
    "custom_icons": "./custom-icons.config/custom-icons.config.js"
  },
  "scripts": {
    "clean": "ionic-app-scripts clean",
    "build": "ionic-app-scripts build",
    "ionic2-custom-icons": "ionic2-custom-icons",
    "ionic:build": "ionic-app-scripts build",
    "ionic:serve": "ionic-app-scripts serve"
  },
  "dependencies": {
    "@angular/common": "4.1.2",
    "@angular/compiler": "4.1.2",
    "@angular/compiler-cli": "4.1.2",
    "@angular/core": "4.1.2",
    "@angular/forms": "4.1.2",
    "@angular/http": "4.1.2",
    "@angular/platform-browser": "4.1.2",
    "@angular/platform-browser-dynamic": "4.1.2",
    "@ionic-native/core": "3.10.2",
    "@ionic-native/splash-screen": "3.10.2",
    "@ionic-native/status-bar": "3.10.2",
    "@ionic/storage": "2.0.1",
    "@ngx-translate/core": "^6.0.1",
    "@ngx-translate/http-loader": "^0.0.3",
    "angular-in-memory-web-api": "^0.3.1",
    "angular2-logger": "^0.5.1",
    "cordova-android": "^6.2.3",
    "cordova-plugin-console": "1.0.5",
    "cordova-plugin-device": "1.1.4",
    "cordova-plugin-splashscreen": "~4.0.1",
    "cordova-plugin-statusbar": "2.2.1",
    "cordova-plugin-whitelist": "1.3.1",
    "cordova-sqlite-storage": "~2.0.4",
    "ionic-angular": "3.3.0",
    "ionic-plugin-keyboard": "~2.2.1",
    "ionic2-custom-icons": "^0.4.1",
    "ionicons": "3.0.0",
    "rxjs": "5.1.1",
    "sw-toolbox": "3.6.0",
    "zone.js": "0.8.11"
  },
  "devDependencies": {
    "@ionic/app-scripts": "1.3.7",
    "@ionic/cli-plugin-cordova": "1.3.0",
    "@ionic/cli-plugin-ionic-angular": "1.3.0",
    "typescript": "2.3.3"
  },
  "cordovaPlugins": [
    "cordova-plugin-whitelist",
    "cordova-plugin-console",
    "cordova-plugin-statusbar",
    "cordova-plugin-device",
    "cordova-plugin-splashscreen",
    "ionic-plugin-keyboard"
  ],
  "cordovaPlatforms": [],
  "description": "ionic-platform: An Ionic project",
  "cordova": {
    "plugins": {
      "cordova-plugin-console": {},
      "cordova-plugin-device": {},
      "cordova-plugin-splashscreen": {},
      "cordova-plugin-statusbar": {},
      "cordova-plugin-whitelist": {},
      "cordova-sqlite-storage": {},
      "ionic-plugin-keyboard": {}
    },
    "platforms": [
      "android"
    ]
  }
}

Update npm packages

rimraf node_modules/
npm install

注意:使用npm加载node_modules,不要使用cnpm,webpack会出现错误,无法打包lazy-loading懒加载文件!!!

⚠️ **GitHub.com Fallback** ⚠️