一、环境搭建

　　Cordova 环境配置之前，应先下载安装 Node.js ，中文官网：http://nodejs.cn/。

　　以管理员身份运行 cmd 命令行工具：

　　1、查看 Node.js 是否已安装成功，命令为：node -v

　　2、查看 npm 是否已安装，命令为：npm -v

　　3、Cordova 安装，命令为：npm install -g cordova，C:\Users\Administrator\AppData\Roaming\npm会生成对应的.cmd文件

　　

　　如果慢，可以修改镜像，再进行安装。

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

　　npm install -g cordova

　　

　　安装成功后做版本查看测试，命令为：cordova -version

　　

　　4、ionic 安装，命令为：npm install -g ionic，C:\Users\Administrator\AppData\Roaming\npm会生成对应的.cmd文件

　　安装成功后做版本查看测试，命令为：ionic -version

　　

　　ios-sim 安装，命令为：npm install -g ios-sim，C:\Users\Administrator\AppData\Roaming\npm会生成对应的.cmd文件

　　安装成功后做版本查看测试，命令为：ios-sim -version

　　

　　5、查看 Java 版本信息，命令为：java -version

　　

　　配置 JAVA_HOME 系统环境变量（已配置直接跳过）：JAVA_HOME=C:\Program Files\Java\jdk1.8.0_101

　　6、查看 ant 版本信息，定位至 Apache Ant 解压目录，ant -version（可跳过）

　　官网地址：http://ant.apache.org/

　　

　　7、配置 Andorid 环境变量

　　path环境变量添加：D:\Program Files\Android\Android\Sdk\android-sdk\platform-tools;D:\Program Files\Android\Android\Sdk\android-sdk\tools;

　　添加系统变量：ANDROID_HOME=C:\Program Files (x86)\Android\android-sdk

　　注：明确知道 adb.exe 的位置（android 2.3 及以上是在 android-sdk\platform-tools 目录下面的，而 2.2 及以下是放在 android-sdk\tools 目录下面），可只在 path 变量中添加其目录。

　　8、查看 adb 版本信息，命令为：adb version

　　　　

　　9、重启电脑....

二、环境测试

　　1、创建工程

　　

　　index.html内容代码如下：

<!DOCTYPE html>

<!--

    Licensed to the Apache Software Foundation (ASF) under one

    or more contributor license agreements.  See the NOTICE file

    distributed with this work for additional information

    regarding copyright ownership.  The ASF licenses this file

    to you under the Apache License, Version 2.0 (the

    "License"); you may not use this file except in compliance

    with the License.  You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

    Unless required by applicable law or agreed to in writing,

    software distributed under the License is distributed on an

    "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY

     KIND, either express or implied.  See the License for the

    specific language governing permissions and limitations

    under the License.

-->

<html>

    <head>

        <!--

        Customize this policy to fit your own app's needs. For more guidance, see:

            https://github.com/apache/cordova-plugin-whitelist/blob/master/README.md#content-security-policy

        Some notes:

            * gap: is required only on iOS (when using UIWebView) and is needed for JS->native communication

            * https://ssl.gstatic.com is required only on Android and is needed for TalkBack to function properly

            * Disables use of inline scripts in order to mitigate risk of XSS vulnerabilities. To change this:

                * Enable inline JS: add 'unsafe-inline' to default-src

        -->

        <meta http-equiv="Content-Security-Policy" content="default-src 'self' data: gap: https://ssl.gstatic.com 'unsafe-eval'; style-src 'self' 'unsafe-inline'; media-src *; img-src 'self' data: content:;">

        <meta name="format-detection" content="telephone=no">

        <meta name="msapplication-tap-highlight" content="no">

        <meta name="viewport" content="user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1, width=device-width">

        <link rel="stylesheet" type="text/css" href="css/index.css">

        <title>Hello World</title>

    </head>

    <body>

        <div class="app">

            <h1>Apache Cordova</h1>

            <div id="deviceready" class="blink">

                <p class="event listening">Connecting to Device</p>

                <p class="event received">Device is Ready</p>

            </div>

        </div>

        <script type="text/javascript" src="cordova.js"></script>

        <script type="text/javascript" src="js/index.js"></script>

    </body>

</html>

index

　　2、编译，运行

　　

　　注意：android模拟器首次运行需要下载安装配置模拟器，故运行缓慢，再次编译运行可直接启动模拟器。

　　3、安装包所在目录：platforms\android\build\outputs\apk

　　4、运行模拟器测试，如下图：

　　

三、注意问题

　　1、WebStorm编译依赖于gradle，WebStorm编译过程中自动下载，时间较长

　　

　　2、Android版本不对，WebStorm创建工程生成的Android版本高，需要在Android SDK Manager中下载

　　

　　3、Android SDK版本统一，platform/android/ 和 platform/android/CordovaLib 各自目录中的 AndroidManifest.xml 和 project.properties 文件中统一一致。

　　

WebStorm 之 Cordova 环境搭建的更多相关文章

  1. cordova 环境搭建

    安装环境前题是nodejs已安装,android环境搭建完成,android环境没有通过http://www.androiddevtools.cn/安装,安装使用 淘宝 NPM 镜像 方式 1.运行c ...

  2. Cordova环境搭建 & HelloWorld

    目前的手机APP有三类:原生APP,WebAPP,HybridApp:HybridApp结合了前两类APP各自的优点,越来越流行. Cordova就是一个中间件,让我们把WebAPP打包成Hybrid ...

  3. sencha touch 2.3 结合cordova 环境搭建

    sencha touch 2.3环境搭建必备工具 sencha touch 2.3 包sencha cmd 4.0以上JAVA JDK 1.7以上(注意JDK和JRE的区别)Ruby 1.9.3或更早 ...

  4. cordova环境搭建

    首先,需要了解一下cordova 和 phonegap 的关系.phoneGap是原先的名字,Cordova是phoneGap被捐给apache之后 用的项目名,phoneGap的名字也被保留了. 1 ...

  5. iOS下JS与OC互相调用（七）--Cordova 环境搭建

    Cordova大家可能比较陌生,但肯定听过 PhoneGap ,Cordova 就是 PhoneGap 被 Adobe 收购后所改的名字.它是一个可以让 JS 与原生代码互相通信的一个库,并且提供了一 ...

  6. webapp开发学习---Cordova环境搭建

    Cordova 使用HTML, CSS & JS进行移动App开发;多平台共用一套代码;免费开源 步骤:(来自Cordova官网) 1.安装Cordova(在node.js环境下进行安装) 命 ...

  7. cordova环境搭建，搭建项目，以及拍照功能的实现

    一.配置环境 1.配置java环境: 下载对应系统环境的jdk:http://www.oracle.com/technetwork/java/javase/downloads/index-jsp-13 ...

  8. WebStorm Cordova 环境搭建

    一.软件安装 1.nodejs 2.npm 3.Cordova 如果慢,可以修改镜像,再进行安装. npm config set registry http://registry.cnpmjs.org ...

  9. nodejs + ionic2 + cordova环境搭建

    1.nodejs 下载地址:https://nodejs.org/zh-cn/,执行默认安装就可以,可执行命令 node(环境变量) 2.修改 npm 源,执行:npm config set regi ...

随机推荐

  1. [转发]将Delphi的对象方法设为回调函数

    心血来潮,为了实现更好的通用性和封装性,需要把类方法作为回调函数,搜得一篇好文,节选转发.命名似乎应该是MethodToCallback才合适,可惜调试时总是报错,debugging. 原文地址:ht ...

  2. C# CSGL

    转.修改自ShareIdeas文章C# 基于CSGL opengl OpenGL是一个功能强大的开放图形库(Open Graphics Library).其前身是SGI公司为其图形工作站开发的IRIS ...

  3. iOS 32位、 64位系统兼容性设置－Xcode创建支持IOS4.3以上版本的应用的方法

    方法一: 如果是Xcode 5的话步骤为 点击项目名称->Build Settings->搜索 Architectures 这个里面的原始的值是Standard architectures ...

  4. ASP.NET MVC：如何提供 Controller 继承体系使用的 ModelBinder？

    背景 Mvc 提供了一种可扩展的模型绑定机制,具体来说就是:将客户端传递的参数按照一定的策略绑定到 action 的参数上,这带来的直接好处就是让 action 的参数支持强类型.一般来说我们有如下方 ...

  5. Unity3D——SendMessage方法的使用

    SendMessage效率不高,因为每次调用的时候都会去遍历检测自身或者子节点上要调用的方法. 一.方法 GameObject自身的Script SendMessage("函数名" ...

  6. clojure中符号symbols 和变量vars的正确理解

    原地址  http://stackoverflow.com/questions/11662084/why-does-clojure-distinguish-between-symbols-and-va ...

  7. linux下生成https的crt和key证书

    今天在配置kibana权限设置时,kibana要求使用https链接. 于是总结了一下linux下openssl生成 签名的步骤: x509证书一般会用到三类文,key,csr,crt   Key 是 ...

  8. Android Activity启动流程源码全解析（1）

    前言 Activity是Android四大组件的老大,我们对它的生命周期方法调用顺序都烂熟于心了,可是这些生命周期方法到底是怎么调用的呢?在启动它的时候会用到startActivty这个方法,但是这个 ...

  9. 制作高仿QQ的聊天系统（上）—— 布局文件 & 减少过度绘制

    由于没有自己的服务器,我就找了个能实现双方通信的SDK,这个SDK是友盟的用户反馈SDK.本系列的博文关注的不是网络通信,而是如何在网络通信机制已经做好的情况下,做出一个可用的聊天系统.其实,刚开始做 ...

  10. 【转】从源码来分析ListView

    原文:http://yanmingming.sinaapp.com/?p=1251 原文其实不叫这个名字,本文对于原文有一定的修改,觉得这个名字比较适合本篇. 一.ListView 的工作原理 Ada ...