1.安装
#全局安装
npm install -g ionic cordova
#安装后验证一下版本
ionic -version
2.创建项目
#通过一下命令可以初始化并配置项目
winpty ionic.cmd start
或者直接指定项目名称和模板
#项目名称为ionic3Demo,模板为tabs
winpty ionic.cmd start ionic3Demo tabs
通过一下命令可以查看模板列表
winpty ionic.cmd start --list
常用模板简介
- tabs :简单的3标签布局
- sidemenu:侧边有可滑动切换菜单的布局
- blank:空白单页
- super:具有超过14个即用型页面设计的起步项目
- tutorial:一个引导起步项目
3.运行
#切换到项目目录
cd ionic3Demo
#安装依赖,不是必须的,编译失败可以尝试此项
npm install
#编译运行,自动在浏览器中打开
ionic serve
在浏览器中查看IOS, Android, WindowsPhone运行效果
可以在地址栏中添加/ionic-lab
即
http://localhost:8100/ionic-lab
4.生成安装包
IOS项目
#添加IOS项目
ionic cordova platform add ios
#编译生成apk,..\ionic3Demo\platforms\ios\app\build\outputs\apk\debug
ionic cordova build ios
#在ios虚拟机中运行项目
ionic cordova emulate ios
Android项目
#添加Android项目
ionic cordova platform add android
#编译生成apk,..\ionic3Demo\platforms\android\app\build\outputs\apk\debug
ionic cordova build android
#在android虚拟机中运行项目
ionic cordova emulate android
注意:这里需要提前配置好iOS或者Android开发环境
附:
更新ionic
npm i -g ionic
网友评论