首先，重要的事情说三遍！跳墙再安装！
首先，重要的事情说三遍！跳墙再安装！
首先，重要的事情说三遍！跳墙再安装！
安装node.js并且更新NPM
安装ionic cordova ---------npm install ionic cordova
安装淘宝镜像----------------请自行百个度
创建ionic2项目 -----------------ionic start [ProjectName] --v2
如果失败，请使用如下命令:ionic start [ProjectName] --v2 --skip-npm
cd [ProjectName]
cnpm install --save
如果此时已经成功创建项目，那么使用如下命令:ionic serve -------------本地运行项目
平台支持：ionic platform add [Name]
通常来说我们只需要Android或者IOS
平台打包以及真机运行：ionic run android ----安卓真机运行
ionic run IOS ----IOS真机运行
ionic build android ----安卓打包
ionic build ios ----IOS打包
ionic2插件调用：
cordova第三方插件:(1)安装插件，如 cordova plugin add cordova-plugin-networkinterface
(2)查看该plugin文件夹下该插件目录中plugin.xml文件中的clobbers标签，这将影响到你如何使用它，如<clobbers target="window.networkinterface" />
(3)在需要的ts文件中增加declara let cordova:any，请注意该行需要放在import部分之后@Component之前
(4)在export中增加使用代码（请注意如果调用方式为window.XXX,调用时请将window改为“(<any>window)”）
附上某home.ts完整代码：
import { Component } from '@angular/core'; import { NavController, NavParams } from 'ionic-angular'; declare let cordova: any; @Component({ selector: 'page-home', templateUrl: 'home.html' }) export class HomePage { constructor(public navCtrl: NavController, public navParams: NavParams) { } getIPAddress(){ if('undefined' != typeof cordova){ (<any>window).networkinterface.getIPAddress(function(ip){ alert(ip); }); } } }
html页面代码（请在任意正文位置加上就行）
<input type='button' (click)='getIPAddress()'>
ionic-native插件：
(1)请注意更新你的本地ionic-native/core，因为这个东西不支持update，所以只能先卸载再安装，命令如下：
npm uninstall @ionic-native/core
npm install @ionic-native/core --save
(2)安装你需要使用的插件（此处以camera为例）
cordova plugin add cordova-plugin-camera
npm install @ionic-native/camera --save
(3)在全局文件中配置,在src/app文件夹下的app.module.ts中
①添加导入（位置随便找个import的地方就行，推荐在import最下面）：import { Camera } from '@ionic-native/camera';
②在@NgModule中的providers中添加Camera(添加进去就行);
③参考官网说明进行实际使用
贴上contact.ts
import { Component } from '@angular/core'; import { NavController } from 'ionic-angular'; import { Camera, CameraOptions } from '@ionic-native/camera'; declare let cordova: any; @Component({ selector: 'page-contact', templateUrl: 'contact.html' }) export class ContactPage { constructor(public navCtrl: NavController, private camera: Camera) { } options: CameraOptions = { quality: 100, destinationType: this.camera.DestinationType.DATA_URL, encodingType: this.camera.EncodingType.JPEG, mediaType: this.camera.MediaType.PICTURE } takePicture() { this.camera.getPicture(this.options).then((imageData) => { let base64Image = 'data:image/jpeg;base64,' + imageData; }, (err) => { alert('Error'); }); } }
再贴上前端代码（老规矩，正文随便找个地方扔进去就行）
<button (click)="takePicture()">Camera</button>
以上，望这篇简易入门以及插件调用文档对诸君有所帮助.
更多内容请参考官网：https://ionicframework.com/docs/
