# electrolyte

**Repository Path**: liangy_dj/electrolyte

## Basic Information

- **Project Name**: electrolyte
- **Description**: electrolyte 是一个生产级桌面应用开发模板，基于 Electron 41、Vue 3.5、Vite 8、TypeScript 6.0 构建。采用 pnpm monorepo 架构，内置窗口管理、用户认证、文件操作、系统通知、托盘、单实例锁等完整功能。shared 包实现前后端纯类型共享，零运行时开销。无 UI 框架依赖，SCSS + CSS 变量自由替换。Husky 
- **Primary Language**: Unknown
- **License**: Not specified
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 1
- **Forks**: 0
- **Created**: 2026-06-02
- **Last Updated**: 2026-06-04

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

# Electron + Vue3 基础模板

一个干净的 Electron + Vue3 基础模板，用于快速启动桌面应用开发。

## 技术栈

- **Electron 41** - 桌面应用框架
- **Vue 3.5** - 前端框架
- **Vite 8** - 构建工具
- **TypeScript 6.0** - 类型支持
- **Pinia 3** - 状态管理
- **SCSS + CSS 变量** - 样式方案
- **pnpm workspace** - Monorepo 管理

## 项目结构

```
electrolyte/
├── apps/
│   ├── renderer/        # Vue3 渲染进程
│   │   ├── src/
│   │   │   ├── pages/   # 页面（登录、首页）
│   │   │   ├── router/  # 路由配置
│   │   │   ├── stores/  # Pinia 状态管理
│   │   │   └── assets/  # 静态资源
│   │   └── vite.config.ts
│   └── main/            # Electron 主进程
│       ├── src/
│       │   ├── main.ts  # 主进程入口
│       │   ├── ipc/     # IPC 处理器
│       │   ├── config/  # 配置模块
│       │   ├── core/    # 核心服务
│       │   └── utils/   # 工具函数
│       └── electron-builder.*.yml
├── packages/
│   ├── preload/         # Electron Preload 脚本
│   └── shared/          # 共享类型定义
└── scripts/             # 构建脚本
```

## 功能特性

- ✅ 窗口控制（最小化、最大化、关闭）
- ✅ 文件操作（选择文件、打开文件、显示在文件夹）
- ✅ 系统通知
- ✅ 用户认证（登录/登出）
- ✅ 系统托盘
- ✅ 单实例锁
- ✅ 双窗口架构（登录窗口 + 主窗口）

## 快速开始

### 安装依赖

```bash
pnpm install
```

### 开发模式

```bash
pnpm dev
```

### 构建

```bash
# 测试环境构建
pnpm build:test

# 生产环境构建
pnpm build:prod
```

### 打包

```bash
# 测试环境打包 - Windows
pnpm pack:test:win

# 测试环境打包 - macOS
pnpm pack:test:mac

# 生产环境打包 - Windows
pnpm pack:prod:win

# 生产环境打包 - macOS
pnpm pack:prod:mac
```

## IPC API

渲染进程可通过 `window.electronAPI` 访问以下 API：

### 窗口操作

```typescript
// 最小化窗口
window.electronAPI.window.minimize();

// 最大化/还原窗口
window.electronAPI.window.maximize();

// 关闭窗口
window.electronAPI.window.close();

// 切换到主窗口
window.electronAPI.window.switchToMain();

// 切换到登录窗口
window.electronAPI.window.switchToLogin();

// 打开外部链接
window.electronAPI.window.openExternal('https://example.com');
```

### 文件操作

```typescript
// 选择文件
const filePaths = await window.electronAPI.file.selectFile({
  multiple: true,
  extensions: ['jpg', 'png'],
});

// 选择图片
const imagePaths = await window.electronAPI.file.selectImage();

// 读取文件为 Data URL
const dataUrl = await window.electronAPI.file.readAsDataUrl('/path/to/file');

// 打开文件
await window.electronAPI.file.openFile('/path/to/file');

// 在文件夹中显示
await window.electronAPI.file.showInFolder('/path/to/file');
```

### 系统通知

```typescript
await window.electronAPI.notification.show({
  title: '通知标题',
  body: '通知内容',
  silent: false,
});
```

### 认证操作

```typescript
// 登录
await window.electronAPI.auth.login({
  token: 'your-token',
  userId: 'user-id',
});

// 登出
await window.electronAPI.auth.logout();

// 获取登录状态（返回 AuthState 或 null）
const authState = await window.electronAPI.auth.status();
```

### 持久化存储

```typescript
// 读取
const value = await window.electronAPI.store.get('key');

// 写入
await window.electronAPI.store.set('key', { data: 'value' });

// 删除
await window.electronAPI.store.delete('key');

// 判断是否存在
const exists = await window.electronAPI.store.has('key');

// 清空全部
await window.electronAPI.store.clear();
```

## 开发规范

### 类型定义

- 前后端共享类型定义在 `packages/shared/src/types/` 目录
- IPC 相关类型在 `electron.ts` 中定义

### IPC 通信

- 渲染进程通过 `preload` 暴露的 `electronAPI` 调用主进程方法
- 主进程在 `apps/main/src/ipc/modules/` 中注册处理器

## License

MIT