设为首页 收藏本站
查看: 999|回复: 0

[经验分享] cordova安装--创建ionic项目

[复制链接]

尚未签到

发表于 2017-2-25 08:01:55 | 显示全部楼层 |阅读模式
1、简介ionic
ionic 是一个强大的 HTML5 应用程序开发框架(HTML5 Hybrid Mobile App Framework )。 可以帮助您使用 Web 技术,比如 HTML、CSS 和 Javascript 构建接近原生体验的移动应用程序。
ionic 主要关注外观和体验,以及和你的应用程序的 UI 交互,特别适合用于基于 Hybird 模式的 HTML5 移动应用程序开发。
ionic是一个轻量的手机UI库,具有速度快,界面现代化、美观等特点。为了解决其他一些UI库在手机上运行缓慢的问题,它直接放弃了IOS6和Android4.1以下的版本支持,来获取更好的使用体验。

2、安装ionic/Install Ionic
首先您需要安装 Node.js. 其次, 安装最新版本的cordova 和 ionic command-line tools. 通过参考Android 和 iOS 官方文档来安装.
提示: IOS需要在Mac Os X. 和Xcode环境下面安装使用 (iOS development requires Mac OS X. iOS simulator through the Ionic CLI requires the ios-sim npm package, which can be installed with the command sudo npm -g install ios-sim.)
$ npm install -g cordova ionic

cmd
node -v
(检查是否有node,-g表示全局安装,否则要配置环境变量。nodejs在官网下载推荐版recommended for most users)
npm install -g cordova ionic
(如已安装nodejs,可用npm安装cordova和ionic)
(链接不上会报错,重新下载即可,下载太慢可分2步npm install -g cordova 和 npm install -g ionic 下载)


3、通过Ionic创建一个项目
使用Ionic官方提供的现成的应用程序模板,或一个空白的项目创建一个Ionic应用。( Create an Ionic project using one of our ready-made app templates, or a blank one to start fresh.)

创建一个目录,cmd cd命令找到目录,再输入ionic start myApp blank命令
myapp是项目名称,可以更改
blank是项目类型
回车后会从网上下载资源,然后会有一个选择y/n,要输入n
创建好的目录不要动
myapp文件夹中:Plugin中是用来操作底层api的插件;
scss是css扩展写法;
www是h5项目,ionic是已发布版本,
angular中是配套的1.5.3版,
bundle是所以js的整合串联,h5页面只引用bundle即可


4、运行Ionic项目
使用Ionic tool 创建 ,测试,运行你的apps(或者通过Cordova直接创建),如果要创建android应用,把右侧创建代码中的ios改为android ( Use the Ionic tool to build, test, and run your apps (or use Cordova directly). Make sure to substitute ios with android to build for Android.)
Then, try Ionic View to share your apps with testers and clients, or to easily test on new devices.

cmd cd找到项目文件myapp
-->ionic platform add ios 或 ionic platform add android
(添加ios、android平台,会下载资源,myapp下会创建platform文件夹--ios、android文件夹)

-->ionic build ios
( 如果是tabs 和 sidemenu 类型的ionic项目,ios要先装xcode; android 要先装 Android SDK)

-->ionic emulate ios

运维网声明 1、欢迎大家加入本站运维交流群:群②:261659950 群⑤:202807635 群⑦870801961 群⑧679858003
2、本站所有主题由该帖子作者发表,该帖子作者与运维网享有帖子相关版权
3、所有作品的著作权均归原作者享有,请您和我们一样尊重他人的著作权等合法权益。如果您对作品感到满意,请购买正版
4、禁止制作、复制、发布和传播具有反动、淫秽、色情、暴力、凶杀等内容的信息,一经发现立即删除。若您因此触犯法律,一切后果自负,我们对此不承担任何责任
5、所有资源均系网友上传或者通过网络收集,我们仅提供一个展示、介绍、观摩学习的平台,我们不对其内容的准确性、可靠性、正当性、安全性、合法性等负责,亦不承担任何法律责任
6、所有作品仅供您个人学习、研究或欣赏,不得用于商业或者其他用途,否则,一切后果均由您自己承担,我们对此不承担任何法律责任
7、如涉及侵犯版权等问题,请您及时通知我们,我们将立即采取措施予以解决
8、联系人Email:admin@iyunv.com 网址:www.yunweiku.com

所有资源均系网友上传或者通过网络收集,我们仅提供一个展示、介绍、观摩学习的平台,我们不对其承担任何法律责任,如涉及侵犯版权等问题,请您及时通知我们,我们将立即处理,联系人Email:kefu@iyunv.com,QQ:1061981298 本贴地址:https://www.yunweiku.com/thread-346792-1-1.html 上篇帖子: 工具篇-编辑器(Atom & Sublime Text3)初体验 & SFTP连接错误实例 下篇帖子: reactjs学习——制作button组件
您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

扫码加入运维网微信交流群X

扫码加入运维网微信交流群

扫描二维码加入运维网微信交流群,最新一手资源尽在官方微信交流群!快快加入我们吧...

扫描微信二维码查看详情

客服E-mail:kefu@iyunv.com 客服QQ:1061981298


QQ群⑦:运维网交流群⑦ QQ群⑧:运维网交流群⑧ k8s群:运维网kubernetes交流群


提醒:禁止发布任何违反国家法律、法规的言论与图片等内容;本站内容均来自个人观点与网络等信息,非本站认同之观点.


本站大部分资源是网友从网上搜集分享而来,其版权均归原作者及其网站所有,我们尊重他人的合法权益,如有内容侵犯您的合法权益,请及时与我们联系进行核实删除!



合作伙伴: 青云cloud

快速回复 返回顶部 返回列表