前端超简单的图文并茂cordova开发使用指南+自定义插件

2022-01-29 23:32:20 阅读：320 来源： 互联网

标签：插件 cordova 自定义 platform npx android 使用指南 Android

Cordova是什么

使用前端技术开发跨平台web App的工具
底层原理:HTML+CSS搭建页面, JS和原生交互
交互原理：Cordova插件

Cordova安装（可以根据自己需求选择安装全局还是安装自己项目文件路径）

npm install -g cordova

或者在项目路径运行cmd命令

npm install cordova

创建Cordova工程

npx cordova create splugin com.xiaojin.splugin Splugin

Create命令详细解析:

保存路径:splugin
项目id:com.xiaojin.splugin,
默认值是io.cordova.hellocordova
安卓中的Java包名, iOS的bundleID都需要用到,此值后期可修改
项目name:Splugin
config.xml中会看到 id和name

添加平台 platform

cd splugin
npx cordova platform add android

查看你添加的平台:

npx cordova platform ls

特别注意:使用CLI构建, 你不可以编辑/platforms/目录. Cordova会根据需求定期自动覆盖此目录中的文件.

使用虚拟机

使用adb链接夜神模拟器

运行项目

npx cordova run android

遇到报错（如果你没有遇到就跳过哦）

ANDROID_SDK_ROOT=undefined (recommended setting)
ANDROID_HOME=C:\Users\Jindi J Sun\AppData\Local\Android\Sdk (DEPRECATED)
Using Android SDK: C:\Users\Jindi J Sun\AppData\Local\Android\Sdk
Could not find an installed version of Gradle either in Android Studio,
or on your system to install the gradle wrapper. Please include gradle 
in your path, or install Android Studio

解决报错

添加环境变量 ANDROID_SDK_ROOT 变量值同 ANDROID_HOME
以管理员身份重新打开vscode,重新执行 npx cordova run android

添加插件进行JS 和原生交互

点击搜索插件

安装插件

npx cordova plugin add cordova-plugin-geolocation

安装插件成功

用代码来进行交互---待补充

常用命令命令之前根据需求添加npx

cordova -v //版本检测
cordova platform add android
cordova platform add ios
完成后运行以下命令查看：
cordova platfrom list
要移除Android平台支持，可以运行：
cordova platform rm android
cordova build android  //只针对Andorid平台编译
实际上build命令对应于以下两个命令：
cordova prepare android
cordova compile android
这意味着你可以仅执行prepare命令，然后用SDK开发环境去另外编译。
cordova requirements //检测是否满足构建平台的要求
cordova plugin add cordova-plugin-camera //添加插件
cordova plugin ls //插件列表

标签：插件,cordova,自定义,platform,npx,android,使用指南,Android
来源： https://www.cnblogs.com/sugartang/p/15853529.html

本站声明： 1. iCode9 技术分享网（下文简称本站）提供的所有内容，仅供技术学习、探讨和分享；
2. 关于本站的所有留言、评论、转载及引用，纯属内容发起人的个人观点，与本站观点和立场无关；
3. 关于本站的所有言论和文字，纯属内容发起人的个人观点，与本站观点和立场无关；
4. 本站文章均是网友提供，不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属；如您发现该文章侵犯了您的权益，可联系我们第一时间进行删除；
5. 本站为非盈利性的个人网站，所有内容不会用来进行牟利，也不会利用任何形式的广告来间接获益，纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。

ICode9