1. 下载并且安装Node.js(https://nodejs.org/en/)

2. 打开终端,安装cordova (如果安装失败或者卡住不动则重新安装)
    sudo npm install -g cordova

如果一直安装不上有可能是镜像问题,改用国内镜像,在终端执行如下命令再次安装:

npm config set registry http://registry.cnpmjs.org npm info underscore

3. 安装ionic
    sudo npm install -g ionic

3.1.安装cordova-hcp cli

输入命令 npm install -g cordova-hot-code-push-cli

4. 如果要调用xcode模拟器则要安装插件

    sudo npm install -g ios-sim

5. 创建项目

1> cd到要创建项目的路径 
   2> ionic start myproject          //  myproject为你要创建的项目名称 (如果不成功或者卡住则重新创建)


ionic start helloIonic tabs --type=ionic1

3> cd myproject                     //  创建成功则进入到项目里面
   4> ionic platform add ios       //  添加ios平台,如果是Android平台则是:ionic platform add android
   5> ionic build ios                   //  编译ios项目,如果是android平台则是:ionic build android
   6> ionic emulate ios              //  模拟器启动项目,如果是android平台则是:ionic emulate android
   7> ionic run ios                     //  真机运行
   8> ionic serve                       //  浏览器调试

9>ionic plugin add cordova-hot-code-push-plugin     //添加热更新插件

10>cordova-hcp build  //生成热更新文件

11>ionic build browser      //编译浏览器

6. 如果使用命令ionic emulate ios 后模拟器跑不起来,可以直接到项目里面:platforms文件夹下的ios文件夹里直接运行项目到xcode上

7. 下载安装WebStorm,打开WebStorm会提示要安装Java环境JDK 根据提示下载安装好

8. WebStorm新建项目:File -> New Project -> 选中PhoneGap/Cordova App

9. 运行项目:Edit Configurations里可配置项目保存路径,运行在哪个平台等

搭建Cordova + Ionic + WebStorm环境开发Web App应用的更多相关文章

  1. 亲手使用Sencha Touch + phonepag开发Web APP随笔 -- 第一个APP

    参考博文: [Phonegap+Sencha Touch] 移动开发1.准备工作 [Phonegap+Sencha Touch] 移动开发2.PhoneGap/Cordova初步使用   经过差不多1 ...

  2. html5文章 -- 使用 jQuery Mobile 与 HTML5 开发 Web App ——开发原则 | Kayo's Melody

    最近专注研究 jQuery Mobile —— 一款很方便就可以把 Web App 包装成适合 Android 与 iPhone 等触屏移动设备的 Javascript 库,结合 jQuery Mob ...

  3. [转]使用 jQuery Mobile 与 HTML5 开发 Web App —— jQuery Mobile 事件详解

    在前文<使用 jQuery Mobile 与 HTML5 开发 Web App —— jQuery Mobile 默认配置与事件基础>中,Kayo 对 jQuery Mobile 事件的基 ...

  4. html5文章 -- 使用 jQuery Mobile 与 HTML5 开发 Web App —— jQuery Mobile 基础

    这篇文章是使用 jQuery Mobile 与 HTML5 开发 Web App 系列的第二篇,在本文以及接下来的数篇文章 Kayo 将会介绍 jQuery Mobile 的组件.事件响应以及可以调用 ...

  5. 利用JQuery Mobile开发web app

    什么是web app web app 是基于web的应用程序,是针对移动设备优化后的web站点,它具有 开发成本低——采用web开发技术,不需要考虑跨平台以及底层适配问题: 升级简单——不需要通知用户 ...

  6. 使用 jQuery Mobile 与 HTML5 开发 Web App 系列文章目录

    使用 jQuery Mobile 与 HTML5 开发 Web App 系列文章目录 时间:2012年9月20日 分类:JavaScript 标签:HTML5‚ jQuery Mobile‚ Web ...

  7. ubuntu15.10下搭建cordova+ionic开发环境

    安装jdk 在命令下输入java如果没有安装会提示该命令包含于openjdk软件包 sudo apt-get install openjdk然后按下tab会列出openjdk开头的软件包 我这里就选择 ...

  8. hybird app(混合式app开发)cordova ionic 创建相应平台的app

    hybird app(混合式app开发) 之ionic 框架平台 guide cordova 创建相应平台的app 1. npm install -g cordova //全局安装cordova-cl ...

  9. Android——WebView方式开发web App

    昨天接到个酬劳丰厚的任务.把java新生系统做成webApp,想想蛮简单的.所以当时就装作非常为难的样子答应了. 所谓Web App,用曾经我那个老PM的话来说.就是在壳里面套上页面.这里的壳相当于浏 ...

随机推荐

  1. hive中left join、left outer join和left semi join的区别

    先说结论,再举例子.   hive中,left join与left outer join等价.   left semi join与left outer join的区别:left semi join相当 ...

  2. SQL EXISTS

    一直对exists的用法不清楚,本次学习exists,并作出相应学习总结. 1.创造测试环境SYS@ora122>create table a(id )); SYS@ora122>inse ...

  3. [c++]base64编解码 and image

    //½«Í¼ÏñתΪbase64¸ñʽ vector<uchar> vecImg; //Mat ͼƬÊý¾Ýת»»Îªvector<uchar> vector< ...

  4. Gym101485: NWERC 2015(队内第6次训练)

    A .Assigning Workstations 题意:给定N个人的工作时间和工作时长,我们可以假设有无数台工作机器,如果一台机器超过M时间未使用就会关闭,那么我们怎么安排机器的使用,使得需要开启机 ...

  5. matlab学习(1)strsplit与strtok

    strsplit函数用法: <1>默认使用空格符分割,返回一个cell数组 <2>也可以指定第二个参数进行分割 <3>第二个参数也可以时包含多个分隔符的元胞数组 & ...

  6. Redis实战之Redis命令

    阅读目录 1. 字符串命令 2. 列表命令 3. 集合命令 4. 散列命令 5. 有序集合命令 6. 发布与订阅命令 7. 小试牛刀 Redis可以存储键与5种不同数据结构类型之间的映射,这5种数据结 ...

  7. 如何简单实用hammer

    1,首先引用hammer在html中        <script src="js/jquery.hammer.js"></script> 2.在js中创建 ...

  8. HDU 2206

    Time Limit:1000MS Memory Limit:32768KB 64bit IO Format:%I64d & %I64u Submit Status Practice HDU ...

  9. java-Random类

    1.Random类的概述和方法使用 * A:Random类的概述 * 此类用于产生随机数 * 如果用相同的种子创建两个 Random 实例,则对每个实例进行相同的方法调用序列,它们将生成并返回相同的数 ...

  10. freemarker的template用法

    package cn.itcast.ssm.util; import com.alibaba.fastjson.JSONObject; import freemarker.cache.StringTe ...