Capacitor打包electron为apk

1.安装

复制代码
安装 Capacitor 核心库

npm install @capacitor/core @capacitor/cli

初始化 Capacitor 配置
npx cap init

运行命令会提示输入
App Name: 你的应用名称

App ID: 应用的唯一标识,通常采用反向域名格式 com.mycompany.myapp

2.安装 Android 平台并添加项目,根目录下出现android目录和capacitor.config.ts配置文件,会复制前端打包的文件,默认目录为dist

复制代码
npm install @capacitor/android
//将打包内容添加到andriod中形成安装的项目文件,如果之前没达包会报错
npx cap add android
//每次更新后使用更新最新的内容到安装的项目
npx cap sync android

如果打包目录不是dist,修改配置文件capacitor.config.ts

复制代码
import type { CapacitorConfig } from '@capacitor/cli';

const config: CapacitorConfig = {
  appId: 'com.apple.cooking',
  appName: 'cooking',
  webDir: 'out/renderer'//文件位置
};

export default config;

3.下载安卓sdk(已有java环境

去android studio下载最新版,并下载sdk

在android 文件夹下创建文件local.properties,记事本打开,输入sdk的路径

复制代码
sdk.dir=D:/AndroiSdk

4.命令行打包测试apk

复制代码
./gradlew assembleDebug

5.在项目/\android\app\build\outputs\apk\debug下有apk文件

6.安装sqlite数据库

1.安装sqlite

复制代码
npm install @capacitor-community/sqlite
npx cap sync

2.安装适配electron的jeep-sqlite>

复制代码
npm install @capacitor-community/sqlite @jeep-sqlite/dom

3.配置jeep-sqlite>

重新同步,打包

相关推荐
请你吃div10 小时前
Electron 从零开始的新手开发教程
vue.js·windows·electron
绿岛之北1 天前
Electron 安全第五章:网络请求安全
前端·electron
Henry1432 天前
给一个每天都在升级的 CLI 做桌面壳,我踩到的五个坑
electron
绿岛之北2 天前
Electron 安全第四章: Preload 与 IPC
前端·electron
NeilCarmack4 天前
Deepseek-harness增加桌面版端序列:第 2 讲 · spawn Electron:当前进程如何“交棒“
前端·javascript·electron
绿岛之北4 天前
Electron 安全第三章:URL 加载与 WebView
前端·electron
菜鸟前端程序员5 天前
当 AI 文件遇上 PDF:一个基于 Electron + Ghostscript 的矢量格式转换引擎深度剖析
electron
clorinda6 天前
把 DeepSeek Harness 打包成类似 Codex 的 Windows 桌面应用:Electron、一键启动、插件管理和动态壁纸
前端·javascript·windows·electron
晴天168 天前
Mojo IPC 和 Electron 的关系-Day21
javascript·electron·mojo
卸任8 天前
AI英语学习助手:从翻译工具到 AI 英语学习助手
前端·electron