WEBAPP开发之cordova webApp开发基础
白羽 2018-07-19 来源 :网络 阅读 1093 评论 0

摘要:本文将带你了解WEBAPP开发之cordova webApp开发基础,希望本文对大家学WebApp有所帮助。

基础环境cordova的依赖环境需要安装nodejs和npm工具,在mac下可以通过brew来进行安装。
node-v
npm-v
如果没有安装的话可以参考这篇文章进行安装开始安装cordova//第一次安装
npminstall-gcordova
npminstall-gionic
npminstall-gios-sim
npminstallbower
并将bower添加环境变量//更新
npmupdate-gcordova
npmupdate-gionic
cordovacreateMyFirstApp//创建项目
cdMyFirstApp //进入项目目录
cordovaplatformaddbrowser //添加pc端的浏览器平台
cordovarunbrowser //运行项目
添加移动平台的工程配置cdMyFirstApp //进入项目目录可以利用命令行查看支持的平台cordovaplatform
Installedplatforms:
browser4.1.0
ios4.1.1
Availableplatforms:
amazon-fireos~3.6.3(deprecated)
android~5.1.1
blackberry10~3.8.0
firefoxos~3.6.3
osx~4.0.1
webos~3.7.0
通过ionic来运行
ionicplatformaddios
ionicbuildios
ionicemulateios
//或者直接使用cordova的指令
cordovaplatformaddios
cordovarunios
开发基础入门
ionicionic是一个强大的HTML5应用程序开发框架(HTML5HybridMobileAppFramework)。可以帮助您使用Web技术,比如HTML、CSS和Javascript构建接近原生体验的移动应用程序。ionic主要关注外观和体验,以及和你的应用程序的UI交互,特别适合用于基于Hybird模式的HTML5移动应用程序开发。ionic是一个轻量的手机UI库,具有速度快,界面现代化、美观等特点。为了解决其他一些UI库在手机上运行缓慢的问题,它直接放弃了IOS6和Android4.1以下的版本支持,来获取更好的使用体验。具体demo可以参见ionic中文网ionic-chinahtml/cssHTML指超文本标签语言。HTML5是下一代的HTML。CSS指层叠样式表(CascadingStyleSheets)。CSS3是最新的CSS标准。在我们移动开发来说,html相当于是客户端开发的一些控件,而css则相当于是autolayout和属性设置。html比较常用,就不说了,下面着重对css案例做一下解析,如果你要在HTML元素中设置CSS样式,你需要在元素中设置”id”和“class”选择器。
.flex-container{
display:-webkit-flex;
display:flex;
width:400px;
height:250px;
background-color:lightgrey;
}

.flex-item{
background-color:cornflowerblue;
width:100px;
height:100px;
margin:10px;
}
js/angularjsAngularJS通过新的属性和表达式扩展了HTML。AngularJS可以构建一个单一页面应用程序(SPAs:SinglePageApplications)。AngularJS学习起来非常简单。后面我们会通过实例来讲解angularjs的一些基本用法.CordovawebApp的运行过程解析项目结构解析一般来说一个项目可能会使用一些第三方的插件问题,再加上各个开发运行的平台差异等特性,所以当大家一起合作开发的时候会维护一个共同的ReadMe文件,里面记录了包含的插件安装等使用方法。每个人都需要经过安装平台->安装插件->运行这个过程安装相应的平台
cordovaplatforms可以查看可以安装的平台
cordovaplatformaddios安装iOS平台
cordovaplatformrmandroid--save 删除已经安装的平台
安装一些依赖插件等
cordovapluginaddcordova-plugin-camera 安装相机插件
cordovapluginrmcamera--save //删除相机插件
cordovapluginls查看已经安装的插件
如果安装jpush插件cordovapluginaddjmessage-phonegap-plugin--variableAPP_KEY=Your_app_key运行工程
ionicbuildios
cdplatforms/ios
里面是个xcode工程打开xcode工程,配置好签名bundleID等一系列的配置工作,可以运行调试并打包发布了学习帮助资料w3schoolionic中文网ionic-chinaangularjs中文网菜鸟教程    

本文由职坐标整理并发布,希望对同学们有所帮助。了解更多详情请关注职坐标移动开发之WebApp频道!

本文由 @白羽 发布于职坐标。未经许可,禁止转载。
喜欢 | 0 不喜欢 | 0
看完这篇文章有何感觉?已经有0人表态,0%的人喜欢 快给朋友分享吧~
评论(0)
后参与评论

您输入的评论内容中包含违禁敏感词

我知道了

助您圆梦职场 匹配合适岗位
验证码手机号,获得海同独家IT培训资料
选择就业方向:
人工智能物联网
大数据开发/分析
人工智能Python
Java全栈开发
WEB前端+H5

请输入正确的手机号码

请输入正确的验证码

获取验证码

您今天的短信下发次数太多了,明天再试试吧!

提交

我们会在第一时间安排职业规划师联系您!

您也可以联系我们的职业规划师咨询:

小职老师的微信号:z_zhizuobiao
小职老师的微信号:z_zhizuobiao

版权所有 职坐标-一站式AI+学习就业服务平台 沪ICP备13042190号-4
上海海同信息科技有限公司 Copyright ©2015 www.zhizuobiao.com,All Rights Reserved.
 沪公网安备 31011502005948号    

©2015 www.zhizuobiao.com All Rights Reserved