美文网首页
ionic3笔记(一)

ionic3笔记(一)

作者: yancoding | 来源:发表于2018-10-06 20:19 被阅读0次

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

相关文章

网友评论

      本文标题:ionic3笔记(一)

      本文链接:https://www.haomeiwen.com/subject/ooeqaftx.html