超详细版本vue+capacitor(自定义capacitor插件)编写移动端应用
我的环境
- Node v16.13.0
- npm v8.1.0
- mac的话需要安装Xcode
- windows的话需要Java 8 JDK和Android Studio软件
本文以安卓开发为例
找一个自己喜欢的路径,全局安装Vue cli
npm install -g @vue/cli
生成VUE项目,根据需求选取自己需要的版本
vue create vue-capacitor-demo
启动项目
cd vue-capacitor-demo
npm run serve
在Web浏览器中访问 http://localhost:8080/
再打开一个cmd窗口,集成Capacitor到我们的VUE项目
npm install --save @capacitor/core @capacitor/cli
初始化Capacitor
npx cap init
使用Capacitor插件--我的其他文章里有,等下我把链接放进来
构建应用程序,添加平台
npm run build
添加平台
npm run build
npm install @capacitor/android
npx cap add android
npx cap copy
运行,自动打开AS软件
npx cap open android
运行成功,可以开始调试啦
超详细版本vue+capacitor(自定义capacitor插件)编写移动端应用的更多相关文章
- RabbitMQ安装说明文档(超详细版本)
RabbitMQ安装说明文档(超详细版本) 1. 安装依赖环境 在线安装依赖环境: yum install build-essential openssl openssl-devel unixODBC ...
- 如何用uniapp+vue开发自定义相机插件——拍照+录像功能
调用手机的相机功能并实现拍照和录像是很多APP与插件都必不可少的一个功能,今天智密科技就来分享一下如何基于uniapp + vue实现自定义相机界面,并且实现: 1: 自定义拍照 2: 自定义录像 3 ...
- Jquery不同版本共用的解决方案(插件编写)
最近在为某公司做企业内部UI库,经过研究分析和评审,决定基于Jquery开发,结合Bootstrap插件那简洁,优雅,高效的思想进行插件编写. 但是在编写的过程中遇到一个头疼的问题,就是正在编写的插件 ...
- mongoDB 安装和配置环境变量,超详细版本
下载mongoDB进行安装:https://www.mongodb.com/ 到Community Se ...
- cena评测系统:自定义校验器(自定义评测插件编写)
Cena评测系统,最受欢迎的信息学竞赛离线评测系统. 它是开放源程序的信息学竞赛评测系统,能满足大多数程序设计竞赛的测评需求. 特色功能: 通过局域网自动收取选手程序. 高效率的数据文件配置工具. 自 ...
- vue命令式组件和插件编写
一直在写各种业务,好多基本用法都忘记了,回顾一下: 一.vue各种UI库里的命令式组件比如element-ui里Notification组件,可以这样调用 this.$notify({ title: ...
- 超详细的Cookie增删改查
目录 1,什么是 Cookie? 1.1,存储形式 1.2,常用属性 1.3,大小限制 2,增 or 改Cookie 3,查Cookie 4,删Cookie 1,什么是 Cookie? Cookie是 ...
- ionic+vue+capacitor系列笔记--capacitor3.X和2.X+android自定义capacitor的JSbridge插件注册与使用(不同版本注册方式不同,返回值格式也不同,使用方法也不同)
经过我的多番折腾,终于搞明白了这个东西的用法,不同版本的注册方法,使用方法都不一样,现在把这个折腾的结果记录下来,造福大家~ 首先编写一个类,然后注册,注意,这个和2.x不一样,2.x的时候我们会使用 ...
- 超详细手把手教你cordova开发使用指南+自定义插件,jsbridge
Cordova是什么 使用前端技术 开发跨平台web App的工具 底层原理:HTML+CSS搭建页面, JS和原生交互 交互原理:Cordova插件 环境配置 安卓开发基础环境搭建的文章可以参考一下 ...
随机推荐
- element-ui el-table 高度自适应
element-ui el-table 高度自适应 <div ref="searchHeader" class="div_search search_title& ...
- Spring事务传播行为实战
一.什么是事务传播行为? 事务传播行为(propagation behavior)指的就是当一个事务方法被另一个事务方法调用时,这个事务方法应该如何运行. 例如:methodA方法调用methodB方 ...
- 2流高手速成记(之五):Springboot整合Shiro实现安全管理
废话不多说,咱们直接接上回 上一篇我们讲了如何使用Springboot框架整合Nosql,并于文章最后部分引入了服务端Session的概念 而早在上上一篇中,我们则已经讲到了如何使用Springboo ...
- 八、docker compose容器编排
一. Docker-Compose 1.1. 什么是Docker Compose Compose 项目是 Docker 官方的开源项目,负责实现 Docker 容器集群的快速编排,开源代码在 http ...
- java简易两数计算器
public class calculator { public static void main(String[] args) { Scanner scanner = new Scanner(Sys ...
- 类的编写模板之简单Java类
简单Java类是初学java时的一个重要的类模型,一般由属性和getter.setter方法组成,该类不涉及复杂的逻辑运算,仅仅是作为数据的储存,同时该类一般都有明确的实物类型.如:定义一个雇员的类, ...
- Element基本组件
Element按钮组件: <el-row> <el-button>默认按钮</el-button> <el-button type="primary ...
- kubeedge的云边协同通道
1. CloudHub安全认证流程 2. EdgeHub安全认证流程 3. Edged节点纳管
- 第2-4-1章 规则引擎Drools介绍-业务规则管理系统-组件化-中台
目录 规则引擎 Drools 1. 问题引出 2. 规则引擎概述 2.1 什么是规则引擎 2.2 使用规则引擎的优势 2.3 规则引擎应用场景 2.4 Drools介绍 规则引擎 Drools 全套代 ...
- c++ 三种继承
继承优先级:private>protect>public 变量或函数函数本身的类型和继承方式,比较,取小的就是继承的访问性 eg: protected x,通过private继承, ...