Cordova in action学习笔记一:windows以及mac安装环境配置

开篇

        好久没做学习笔记了,准备静下心来好好读书,那就选一本吧,就《apache cordova in action》吧,评价很不错的一本书.

        1.1 cordova 是什么

              cordova就是做html5 网站开发,通过接口可以实现android/ios 手机的原生组件调用,比如摄像头,电话号码,gps地理信息等等.可打包发布到各大应用市场,apple store                

        1.2 为什么学习cordova

               cordova使用成熟的html5+css+js技术,使得用户并不需要学习原生的android/ios开发,实现现有技术最大利用,学习成本低,开发速度快.你可以用你熟练的web开发技术以及巨大的web社区资源

环境配置

       使用cordova首先需要配置环境,包括android sdk 和 ios sdk, ios开发需要一台mac机(如果没有,也可以用虚拟机)

   2.1 安装node.js

     在node.js官网Downloads页面下载最新版安装即可

     

       2.2 安装android sdk

         2.2.1 下载安装 android sdk tools ,国内google被墙了,建议到 http://www.android-studio.org 找网盘下载,

         2.2.2 打开android sdk manager ，

                  如果是pc，直接打开， 如果是mac 机，使用终端进入到sdk/tools目录下，键入./android sdk 回车后就进入了android sdk manager图形界面

         2.2.3  在Android SDK Manager -> Preferences 设置代理：mirrors.neusoft.edu.cn，同时勾上force https://..... ,见下图

                  

      2.2.4 在android sdk manager 中勾选常用的sdk，开始更新下载

   2.3 安装ios sdk（仅限mac机，如果不需要开发ios 的，可以忽略）

      2.3.1 打开appstore，下载xcode

      2.3.2  安装xcode后，打开终端，输入

$ xcode-select --install

              会弹出窗口让安装命令行开发者工具，选择安装即可，见下图

               

     2.3.3 安装发布工具，在终端输入

$ npm install -g ios-sim
$ npm install -g ios-deploy

              如果提示permission denied，请在npm前面加sudo 前缀

           如果安装ios-deploy 的时候加了sudo还是一直无法安装成功，建议可以用淘宝的镜像cnpm安装，使用淘宝镜像方法如下

  

$ npm install -g cnpm --registry=https://registry.npm.taobao.org

$ cnpm install -g ios-deploy

         注，如果其他npm无法down下来的话，都可以用淘宝镜像下载

      

   2.4 安装apache ant

     2.4.1 windows 安装，访问apache ant官网

• Binary Distributions

        2.4.1.1 下载zip文件，把zip文件解压即可

     2.4.2 mac安装，ant在mac上安装十分麻烦，建议安装brew来安装ant

        2.4.2.1 终端敲命令，安装brew：

$ ruby -e "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/install)"

        如果之前安装过brew，则输入更新最新版

$ brew update

     2.4.2.2 安装ant

$ brew install ant

       测试ant是否安装成功，输入

$ ant -version

       出现版本号则表示安装成功

  2.5 安装git，如果已安装过git可以跳过这一步

    2.5.1 windows版从www.git-scm.com下载

    2.5.2 mac直接敲命令

$ npm install -g git

  2.6 设置windows path，右击计算机－属性－高级系统设置－高级－环境变量－系统变量

     2.6.1 添加变量名：JAVA_HOME 值：C:\Program Files\Java\jdk1.8.0_51  //java安装路径，以实际路径为准

     2.6.2 添加变量名：ClassPath        值：.;%JAVA_HOME%\lib\dt.jar;%JAVA_HOME%\lib\toos.jar

     2.6.3  修改变量名：Path       增加值：%JAVA_HOME%\bin

                                                                 ;D:\Program Files\android-sdk\tools;D:\Program Files\android-sdk\platform-tools   // android sdk所在路径，以实际路径为准

                                                                 ;D:\Program Files\apache-ant-1.9.7\bin    //设为2.4下载下来的ant放置的路径

                                                                 ;C:\Program Files (x86)\Git\cmd                 // 设为git的安装路径，注，这个安装的时候如果已经自动设好了，就不需要重复添加

                                                                 ;C:\Program Files (x86)\nodejs                  // 设为node.js的安装路径，注，这个安装的时候如果已经自动设好了，就不需要重复添加

     2.6.4  测试path设置是否成功，cmd命令行分别输入命令

                adb

                ant      //注意，这个可能会返回 build failed的异常，这个属于正常的

               javac

                git

                npm

  2.7 步入正题，安装Cordova,输入以下命令，window命令下，mac终端都一样，都是输入npm install -g cordova 

     

$ npm install -g cordova

测试是否安装成功 输入

$ cordova -v




    2.8 测试创建一个cordova项目

新建一个目录，然后命令行cd到该目录，然后输入

     

$ cordova create myFirstProject

     回到该目录，你应该看到已经建好了一个文件夹叫myFirstProject,下面有一堆文件,见下图

      恭喜你，你的第一cordova项目建立成功（虽然是个空项目，哈哈）。