cordova插件的开发完整流程

来源:互联网 发布:淘宝开店实名认证在哪 编辑:程序博客网 时间:2024/05/20 20:47

1、Node.js安装配置

由于Cordova命令行工具发布在了npm包管理平台上,npmnodejs内置的包管理工具,所以安装cordova前需要先确认你是否已经安装过Nodejs

1)安装包的下载,下载地址:http://nodejs.cn/download/,选择好对应的版本。本次现在的的Windows系统(.zip)版本。

2)下载完成后,解压,点击安装包Node.exe,将出现命令行窗口。



3)进入node.exe所在目录,执行node --version,查看是否安装成功,出现对应的版本号,则表示安装成功。

4)添加node.exe所在的路径到系统环境变量path中,以便能全局使用npm命令。



2、JDK及SDK系统环境配置

JDK的配置不详细说,网上很多教程。

SDK系统环境变量的配置:

1)添加系统变量,变量名:ANDROID_HOME;变量值:D:\software\android-sdk-windows(SDK所在路径)。

2)添加路径到Path系统变量中:%ANDROID_HOME%\tools;%ANDROID_HOME%\platform-tools



3、Cordova安装

打开命令行工具,执行命令

npminstall -g cordova

 

安装成功后,执行命令查看cordova的版本

cordova-v

 

可以看到,安装成功后,node_modules目录下多了一个cordova的文件夹




4、Cordova插件的开发

1)创建插件,执行命令:

Cordovacreate --name EnsurePlugin --plugin_id ensure --plugin_version 1.0.0

表示创建一个插件,插件名为EnsurePlugin ,插件ID为ensure,插件版本为1.0.0

创建成功后,如下:


在src文件夹下创建android文件夹(支持的是Android平台),并在android文件夹下创建libs文件夹(因为需要引用jar包),如果有引用到资源文件,也需要创建res文件夹,用于存放资源文件。


EnsurePlugin-----------

                |------src

                |         |-----android

                |                      |------libs    (我们导入了一个jar嘛)

                |                      |                                  |--------Ensure.jar

                |                      |

                |                      |------EnsurePlugin.java

    

                |------www

                |          |------EnsurePlugin.js

                |-------plugin.xml


目录结构分析:

*src用于存放各个平台的本地代码,因为现在只做Android平台的,所以只有一个android文件夹。

*www用于存放js文件,js文件主要做接口用(一般使用命令创建的时候会自动生成一个,但是需要修改)。

*plugin.xml文件是插件的配置文件,至关重要。

 

2)修改EnsurePlugin.js

定义相关的接口,提供给js调用。实际上调用的是本地java方法。

 

3)配置plugin.xml




5、Cordova应用创建和插件的测试

 

1)创建Cordova项目

执行命令:cordova create project_name app_id app_name

 

例如执行命令:cordova create hello com.example.hello HelloWorld

这个命令会自动创建一个hello(第一个参数,项目名称)的文件夹,第二个参数com.example.hello为项目包的一个标识符(当添加android平台的时候,会创建一个android项目,这个标识符作为项目的包名)。如果在创建的时候不添加这个参数,cordova会自动生成,而之后我们可以在根目录下的config.xml下手动更改这个项目标识符名称。

最后一个参数为程序显示的标题名称。同样如果不写,cordova会自动生成,也可以在config.xml下手动配置。

2)添加运行平台

命令:cordova platform add android



添加成功之后,可以看到,这个命令会创建一个android project,路径位于platforms/android,包名就是我们之前指定的包名,还会创建一个默认的MainActivity,默认的target android 版本为26。



3)添加插件

 执行命令:cordova pluginadd plugin_path

这是添加本地的插件,最后一个字符串为本地插件的路径。添加插件成功之后,在项目下面的plugins目录下回多了一个文件夹。





这个就是我们添加的插件。



4)构建Android平台

 执行命令:cordova buildandroid


构建成功后,会生成一个apk。


5)运行应用

 插上手机后,执行命令:cordova run android


成功之后,应用就会打开。