zoukankan      html  css  js  c++  java
  • cordova安装--创建ionic项目

    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
     
  • 相关阅读:
    tectangular container
    WIFI
    微信小程序动态改变数组或对象中的某个属性值
    常用的正则表达式
    前端登录通过账号显示对应头像
    JS返回页面时自动回滚到历史浏览位置
    JavaScript让登录或搜索文本框自动获得焦点
    react脚手架应用
    npm教程3_脚手架原理以及bootstrap引入
    npm教程2
  • 原文地址:https://www.cnblogs.com/animagi/p/5465267.html
Copyright © 2011-2022 走看看