phonegap安装 环境搭建与配置详解( 完整版 提供下载地址)
2015-03-17 09:56
609 查看
phonegap 安装 环境搭建 完整版
刚刚接触 phonegap 因为配环境遇到各种各样问题.花了一下午时间才完成,所以写一个篇文章希望能给大家节约点时间.
本文主讲windows系统下的phonegap的环境搭建 ,以android视角为主.ios用户可参考;
首先介绍搭建环境的基本准备:
1 java JDK (搜索一下.......)
2 android SDK 最新版(我当时的版本是 API 19 点击打开链接)
3 Ant 打包工具 (百度一个或者 点击打开链接)
4 eclipse (建议使用google的 因为内置ADT 点击打开链接 )
5 ADT (ecplise 里的插件,安卓开发工具插件 下载上面的链接,内部集成了ADT)
6 Node.js (点击打开链接)
7 sublime 点击打开链接 ;是我开发js h5 css 的工具;如果大家有好的开发软件希望能告诉我一下谢谢
下图是Node.js安装成功后
![](https://oscdn.geek-share.com/Uploads/Images/Content/201403/4a61ed3af6bc6309190bd8a35f102f9c)
将以上配置好环境变量 (配置方法略 点击 )
特别提一下需要配环境变量的东西: java JDK ; android SDK;Ant ;
贴上我的 path 供大家参考:
(建议配成 ;%ANT_HOME%\bin; 去掉\bin)
F:\工具\Ant\ant-1.8\bin;
C:\Develop\sdk\sdk\platform-tools;C:\Develop\sdk\sdk\tools;%Android%\.;C:\Develop\nodejs;%JAVA_HOME%\bin;C:\Develop\nodejs\
拥有以上工具后
接下来开始phonegap的安装了
phonegap 官网 点击
在控制台运行命令:
npm install -g phonegap ( Mac使用: sudo npm install -g phonegap )
//等待安装 完成后安装 cordova:
npm install -g cordova ( Mac使用: sudo npm install -g cordova )
![](https://oscdn.geek-share.com/Uploads/Images/Content/201403/e41b78f67f19396d71edd577b9b87783)
![](https://oscdn.geek-share.com/Uploads/Images/Content/201403/83a18af164b3b797280a9f6bb241638d)
安装完成后
检验语句:
![](https://oscdn.geek-share.com/Uploads/Images/Content/201403/5068980e1cde12c2c9095c693ce5b562)
![](https://oscdn.geek-share.com/Uploads/Images/Content/201403/23817008721a8461b07459228be84580)
在命令行 使用:
[html] view
plaincopy
![](https://oscdn.geek-share.com/Uploads/Images/Content/201611/a7c8e286f463007e2a900848b93dd72c.png)
![](https://oscdn.geek-share.com/Uploads/Images/Content/201611/9e12f1d3e499fc949c886e7c9e0484f9)
phonegap create my-app
cd my-app
phonegap run android
第一个 phonegap写的程序就出现了
在my-app 目录下出现5个文件夹 打包好的工程放在platforms里面
![](https://oscdn.geek-share.com/Uploads/Images/Content/201403/9f5cf9645247aea5b80c1b625d23b798)
文件夹详解:
www : 文件夹 开发的 HTML5 ; CSS ; JS 文件都拷贝到这下面
plugins : 文件夹 存放的是phonegap插件 以后 文件,摄像头等插件都下载到这里,在下篇文章中介绍用法
merges : 我也没用过 以后知道了再补上
platforms : 文件夹 存放的是编译好后的android文件 ,(如果这个文件夹为空,需要你在命令行编译一次才能生成. 如上面 phonegap run android)
.cordova : 存放的是配置文件
将此文件夹导入 eclipse 就可以使用
phonegap 将以第三方库的形式导入
如果src文件报错 检查是否是 phonegap的功能没有导入进来
导入eclipse后 文本结构....下图打的camera 和 vibration 是 相机与铃声的插件 下章节介绍
![](https://oscdn.geek-share.com/Uploads/Images/Content/201403/5c5989e748bcca413773fabbe0d77a44)
(图 1)
下图是 phonegap的启动页面 调用 super.loadUrl(); 方法
[java] view
plaincopy
![](https://oscdn.geek-share.com/Uploads/Images/Content/201611/a7c8e286f463007e2a900848b93dd72c.png)
![](https://oscdn.geek-share.com/Uploads/Images/Content/201611/9e12f1d3e499fc949c886e7c9e0484f9)
public class baozi extends CordovaActivity
{
@Override
public void onCreate(Bundle savedInstanceState)
{
super.onCreate(savedInstanceState);
super.init();
// Set by <content src="index.html" /> in config.xml
// super.loadUrl(Config.getStartUrl());
super.loadUrl("file:///android_asset/www/index.html");
}
}
在 super.loadUrl(" "); 中填写你的启动页面
参数: " file:///android_asset/www/index.html "
指的是( 图 1)的 assets目录下 www 文件夹下的 index.html
贴上一张 工程导入后的属性图
![](https://oscdn.geek-share.com/Uploads/Images/Content/201403/520b48dc59a47a508aec0f6213a4e4e5)
工程下载 将phonegap的platforms导入到eclipse中
如果报错clear一下 查看导的lib包 有没有报错
如果还有错 那么就是您选用了 google的API 改成最新版的android API 就好了
如果导入工程遇到问题 可以查阅我此篇文章
Blog: /article/1337728.html
Phonegap解决错误:Error initializing Cordova:Class not found:
/article/1337723.html
phonegap 安装 环境搭建 完整版
刚刚接触 phonegap 因为配环境遇到各种各样问题.花了一下午时间才完成,所以写一个篇文章希望能给大家节约点时间.
本文主讲windows系统下的phonegap的环境搭建 ,以android视角为主.ios用户可参考;
首先介绍搭建环境的基本准备:
1 java JDK (搜索一下.......)
2 android SDK 最新版(我当时的版本是 API 19 点击打开链接)
3 Ant 打包工具 (百度一个或者 点击打开链接)
4 eclipse (建议使用google的 因为内置ADT 点击打开链接 )
5 ADT (ecplise 里的插件,安卓开发工具插件 下载上面的链接,内部集成了ADT)
6 Node.js (点击打开链接)
7 sublime 点击打开链接 ;是我开发js h5 css 的工具;如果大家有好的开发软件希望能告诉我一下谢谢
下图是Node.js安装成功后
将以上配置好环境变量 (配置方法略 点击 )
特别提一下需要配环境变量的东西: java JDK ; android SDK;Ant ;
贴上我的 path 供大家参考:
(建议配成 ;%ANT_HOME%\bin; 去掉\bin)
F:\工具\Ant\ant-1.8\bin;
C:\Develop\sdk\sdk\platform-tools;C:\Develop\sdk\sdk\tools;%Android%\.;C:\Develop\nodejs;%JAVA_HOME%\bin;C:\Develop\nodejs\
拥有以上工具后
接下来开始phonegap的安装了
phonegap 官网 点击
在控制台运行命令:
npm install -g phonegap ( Mac使用: sudo npm install -g phonegap )
//等待安装 完成后安装 cordova:
npm install -g cordova ( Mac使用: sudo npm install -g cordova )
安装完成后
检验语句:
phonegap -version
cordova -version
在命令行 使用:
[html] view
plaincopy
![](https://oscdn.geek-share.com/Uploads/Images/Content/201611/a7c8e286f463007e2a900848b93dd72c.png)
phonegap create my-app
cd my-app
phonegap run android
第一个 phonegap写的程序就出现了
在my-app 目录下出现5个文件夹 打包好的工程放在platforms里面
文件夹详解:
www : 文件夹 开发的 HTML5 ; CSS ; JS 文件都拷贝到这下面
plugins : 文件夹 存放的是phonegap插件 以后 文件,摄像头等插件都下载到这里,在下篇文章中介绍用法
merges : 我也没用过 以后知道了再补上
platforms : 文件夹 存放的是编译好后的android文件 ,(如果这个文件夹为空,需要你在命令行编译一次才能生成. 如上面 phonegap run android)
.cordova : 存放的是配置文件
将此文件夹导入 eclipse 就可以使用
phonegap 将以第三方库的形式导入
如果src文件报错 检查是否是 phonegap的功能没有导入进来
导入eclipse后 文本结构....下图打的camera 和 vibration 是 相机与铃声的插件 下章节介绍
(图 1)
下图是 phonegap的启动页面 调用 super.loadUrl(); 方法
[java] view
plaincopy
![](https://oscdn.geek-share.com/Uploads/Images/Content/201611/a7c8e286f463007e2a900848b93dd72c.png)
public class baozi extends CordovaActivity
{
@Override
public void onCreate(Bundle savedInstanceState)
{
super.onCreate(savedInstanceState);
super.init();
// Set by <content src="index.html" /> in config.xml
// super.loadUrl(Config.getStartUrl());
super.loadUrl("file:///android_asset/www/index.html");
}
}
在 super.loadUrl(" "); 中填写你的启动页面
参数: " file:///android_asset/www/index.html "
指的是( 图 1)的 assets目录下 www 文件夹下的 index.html
贴上一张 工程导入后的属性图
工程下载 将phonegap的platforms导入到eclipse中
如果报错clear一下 查看导的lib包 有没有报错
如果还有错 那么就是您选用了 google的API 改成最新版的android API 就好了
如果导入工程遇到问题 可以查阅我此篇文章
Blog: /article/1337728.html
Phonegap解决错误:Error initializing Cordova:Class not found:
/article/1337723.html
相关文章推荐
- phonegap安装 环境搭建与配置详解( 完整版 提供下载地址)
- phonegap安装 环境搭建与配置详解(3.4 完整版 提供下载地址)
- phonegap安装 环境搭建与配置详解(3.4 完整版 提供下载地址)
- phonegap安装 环境搭建与配置详解( 完整版 提供下载地址)
- phonegap安装 环境搭建与配置详解( 完整版 提供下载地址)
- phonegap安装 环境搭建与配置详解( 完整版 提供下载地址)
- phonegap安装 环境搭建与配置详解( 完整版 提供下载地址)
- phonegap安装 环境搭建与配置详解( 完整版 提供下载地址)
- phonegap安装 环境搭建与配置详解( 完整版 提供下载地址)
- phonegap安装 环境搭建与配置详解
- Maven下载安装、Eclipse配置maven详解、如何测试环境是否搭建成功及在Eclipse中创建Maven项目
- 如何搭建Java开发环境(包括下载、安装和配置JDK)和Eclipse的安装
- 01-01.Java基础windows下搭建环境-JDK下载安装与配置
- phonegap 3.4 安装 环境搭建 完整版
- 胡博君图解Java之eclipse下载地址和JDK下载和安装和环境变量配置
- 【环境配置】Linux环境下下载、配置java环境、安装eclipse、建立eclipse快捷方式详解
- 详解Linux环境下Mysql的安装(含下载地址)
- php myeclipse 软件的下载、安装,环境的搭建、配置
- Qt_4_8版本的安装步骤、环境配置以及软件下载地址
- PhoneGap安装 环境搭建及配置