无限便签 (InfinityNote)

🚀 现代化无限画布便签应用 - 支持 AI 生成、思维链可视化、多主题的智能便签工具

English | 简体中文

📸 应用截图

💡 提示: 建议在 /docs/screenshots/ 目录下添加应用截图展示核心功能

🎯 项目简介

无限便签是一款基于 Electron + React 的跨平台无限画布便签应用，专为知识管理和创意思考而设计。它将传统便签的灵活性与现代 AI 技术结合，提供流畅的使用体验和强大的功能。

✨ 核心特性

🎨 无限画布体验

自由布局: 无限画布空间，自由拖拽、缩放便签
可视化连接: 使用连接线建立便签之间的关系
画布导航: 快速缩放、平移、定位到便签

🤖 AI 智能助手

多提供商支持: OpenAI、Claude、DeepSeek、智谱 AI、通义千问、Kimi 等
流式生成: 实时显示 AI 生成内容，体验流畅
思维链可视化: 直观展示 AI 的思考推理过程
自定义模板: 内置多种提示词模板，支持自定义

⚡ 高效编辑

富文本编辑: 基于 TipTap 的强大编辑器
Markdown 支持: 快捷键、语法高亮、实时预览
快捷操作: 撤销/重做、快捷键、拖拽排序

🎭 个性化定制

多主题: 明亮/暗黑主题自动切换
便签样式: 11 种预设颜色，自定义标签分类
本地存储: 基于 IndexedDB，数据安全可靠

🛠️ 技术栈

核心框架

React 19.1.1 - 最新版本的 React 框架
TypeScript 5.8.3 - 类型安全的 JavaScript
Vite 7.1.2 - 下一代前端构建工具

UI & 交互

Ant Design 5.27.3 - 企业级 UI 组件库
TipTap 3.4.2 - 现代化富文本编辑器
@dnd-kit - 拖拽交互库

状态管理 & 存储

Zustand 5.0.8 - 轻量级状态管理
Dexie 4.2.0 - IndexedDB 封装库

AI 集成

多提供商支持 - OpenAI、Anthropic、DeepSeek、智谱 AI 等
流式处理 - 实时内容生成和显示
思维链 - AI 推理过程可视化

🚀 快速开始

📥 安装应用

下载预构建版本（推荐）

前往 Releases 页面下载适合您系统的安装包：

macOS:

Apple Silicon (M1/M2/M3): 无限便签-2.0.0-arm64.dmg
Intel 芯片: 无限便签-2.0.0.dmg

详细安装说明请参考下文的从源码构建章节。

Windows (即将推出):

无限便签 Setup 2.0.0.exe

Linux (即将推出):

无限便签-2.0.0.AppImage

🛠️ 从源码构建

环境要求

Node.js >= 20.19.0
npm >= 10.0.0

安装与运行

# 1. 克隆项目
git clone https://github.com/duobaobox/infinitynote.git
cd infinitynote

# 2. 使用 cnpm 安装依赖（推荐，速度更快）
cnpm install --legacy-peer-deps

# 3. 启动开发服务器（Web 版）
npm run dev

# 4. 或启动 Electron 开发环境（推荐）
npm run electron:dev

代码质量检查

在提交代码前，请运行完整的代码验证：

# 运行所有检查：TypeScript 类型检查、ESLint、格式化、单元测试
npm run verify

# 或分别运行：
npm run type-check    # TypeScript 类型检查
npm run lint:fix      # ESLint 检查和自动修复
npm test              # 运行单元测试
npm run test:coverage # 生成覆盖率报告

注意: Windows 用户如果 git hooks 失效，请手动运行上述命令确保代码质量。

构建应用

# 构建 Web 版本
npm run build

# 构建 Electron 应用（根据当前系统）
npm run electron:build

# 构建特定平台
npm run electron:build:mac     # macOS
npm run electron:build:win     # Windows
npm run electron:build:linux   # Linux

⚙️ 配置 AI 服务

启动应用后，点击右上角设置图标
在「AI 配置」选项卡中：
- 选择您的 AI 提供商（OpenAI、Claude、DeepSeek 等）
- 输入 API 密钥
- 选择模型（如 gpt-4、claude-3-opus 等）
保存配置后即可使用 AI 功能

💡 提示: API 密钥仅存储在本地，不会上传到任何服务器

使用文档

基础操作

创建便签: 双击画布空白处或点击工具栏「新建」按钮
编辑便签: 点击便签进入编辑模式
移动便签: 拖拽便签标题栏
调整大小: 拖拽便签边缘
删除便签: 点击便签右上角删除按钮
创建连接: 从便签边缘的连接点拖拽到另一个便签

AI 功能

AI 生成: 选中文本后点击 AI 图标，或使用快捷键
查看思维链: 启用「显示思维链」选项查看 AI 推理过程
停止生成: 生成过程中点击「停止」按钮

键盘快捷键

Ctrl/Cmd + Z: 撤销
Ctrl/Cmd + Y: 重做
Ctrl/Cmd + S: 保存（自动保存）
Ctrl/Cmd + F: 搜索便签
Esc: 退出编辑模式

📁 项目结构

infinitynote/
├── electron/              # Electron 主进程和预加载脚本
├── src/
│   ├── components/        # React 组件
│   │   ├── NoteCard/      # 便签卡片组件
│   │   ├── TiptapEditor/  # 富文本编辑器
│   │   ├── AIInlineControl/ # AI 控制面板
│   │   └── ...
│   ├── services/          # 业务服务层
│   │   ├── ai/            # AI 提供商实现
│   │   ├── aiService.ts   # AI 服务统一接口
│   │   └── templateService.ts
│   ├── store/             # Zustand 状态管理
│   │   ├── canvasStore.ts # 画布状态
│   │   ├── noteStore.ts   # 便签状态
│   │   └── historyStore.ts # 历史记录
│   ├── hooks/             # 自定义 Hooks
│   ├── utils/             # 工具函数
│   ├── types/             # TypeScript 类型定义
│   └── theme/             # 主题配置
├── tests/                 # 测试文件
├── docs/                  # 文档
└── public/                # 静态资源

开发与测试

运行测试

# 运行所有测试
npm run test

# 性能基准测试
npm run test:performance

# 打包大小分析
npm run test:bundle

代码质量

# 代码检查
npm run lint

# 自动修复代码问题
npm run lint:fix

# 类型检查
npm run type-check

🔄 自动更新与发布

更新通道：使用 GitHub Releases（duobaobox/infinitynote）。
构建产物：electron-builder 自动生成 latest.yml/app-update.yml 及对应安装包，供客户端增量更新。
发布步骤：
1. 提前在 GitHub 设置 GH_TOKEN（repo 发布权限）。
2. 确保 package.json 的版本号已递增，并执行 npm install 安装依赖（包含 electron-updater）。
3. 运行 GH_TOKEN=your_token npm run electron:build -- --publish always（或指定平台的构建脚本加 --publish always）。
4. 构建完成后会在 GitHub 创建 Draft Release 并上传安装包 + 更新元数据文件，发布后客户端即可增量更新。
客户端使用：在「设置 > 关于我们」里点击「检查更新」或开启「自动更新」。下载完成后点击「安装更新并重启」。

🤝 贡献指南

我们欢迎所有形式的贡献！无论是报告 Bug、提出新功能建议，还是提交代码。

如何贡献

Fork 本仓库
创建您的特性分支 (git checkout -b feature/AmazingFeature)
提交您的更改 (git commit -m 'Add some AmazingFeature')
推送到分支 (git push origin feature/AmazingFeature)
开启一个 Pull Request

开发规范

遵循项目的代码风格（使用 ESLint）
为新功能编写测试
更新相关文档
确保所有测试通过
提交信息清晰明了

详细贡献指南请查看 CONTRIBUTING.md（即将添加）

报告问题

发现 Bug？请通过 Issues 报告，并包含：

问题描述
复现步骤
预期行为
实际行为
系统环境（OS、Node.js 版本等）
截图或错误信息（如有）

🗺️ 开发路线（顺序可能会有调整）

v2.1: 客户端增加桌面悬浮便签功能
v2.2: 提示词模板功能完善
v2.3: 工作台功能开发（待收集的功能，欢迎反馈）
v2.4: 云同步功能开发
v2.5: 回收站功能开发
v3.0: 画布分享功能开发

查看详细的 Roadmap 和更新日志

📄 许可证

本项目采用 MIT 许可证 - 详见 LICENSE 文件

🙏 鸣谢

感谢以下开源项目：

React - 用户界面构建库
Electron - 跨平台桌面应用框架
Ant Design - 企业级 UI 组件库
TipTap - 无头富文本编辑器
Zustand - 轻量级状态管理
Vite - 新一代前端构建工具
Dexie.js - IndexedDB 封装库
leader-line - 连接线绘制库

社区与支持

📮 问题反馈: GitHub Issues
💡 功能建议: GitHub Discussions
📧 联系作者: 通过 GitHub Profile 联系

⭐ Star History

如果这个项目对您有帮助，请给我们一个 ⭐！

用 ❤️ 制作 | Made with Love

回到顶部 ↑

Name		Name	Last commit message	Last commit date
Latest commit History 260 Commits
.github/workflows		.github/workflows
.husky		.husky
build		build
docs		docs
electron		electron
public		public
scripts		scripts
src		src
tests		tests
.env.example		.env.example
.gitignore		.gitignore
.lintstagedrc.json		.lintstagedrc.json
CHANGELOG.md		CHANGELOG.md
LICENSE		LICENSE
OPTIMIZATION_COMPLETE.md		OPTIMIZATION_COMPLETE.md
OPTIMIZATION_REPORT.md		OPTIMIZATION_REPORT.md
README.md		README.md
commitlint.config.js		commitlint.config.js
electron-builder.json		electron-builder.json
eslint.config.js		eslint.config.js
floating.html		floating.html
index.html		index.html
package-lock.json		package-lock.json
package.json		package.json
tsconfig.app.json		tsconfig.app.json
tsconfig.json		tsconfig.json
tsconfig.node.json		tsconfig.node.json
vite.config.ts		vite.config.ts
vitest.config.js		vitest.config.js

Folders and files

Latest commit

History

Repository files navigation