# EasyMD

**Repository Path**: gogogj/easy-md

## Basic Information

- **Project Name**: EasyMD
- **Description**: No description available
- **Primary Language**: Unknown
- **License**: Not specified
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 0
- **Forks**: 0
- **Created**: 2026-02-16
- **Last Updated**: 2026-02-17

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

# Markdown Editor

一个简洁、扁平化设计的 Markdown 编辑器，使用 Electron + React 构建。

## 功能特点

- 📝 **Monaco 编辑器** - VS Code 同款专业代码编辑器
- 👁️ **实时预览** - 编辑和预览同步更新
- 🎨 **扁平化 UI** - 类似 opencode 的现代化界面设计
- 🌓 **深色/浅色主题** - 支持主题切换，标题栏同步变色
- 📂 **文件操作** - 支持新建、打开、保存 Markdown 文件
- 🖱️ **窗口拖动** - 支持拖动标题栏移动窗口
- 📱 **分屏模式** - 支持编辑/分屏/预览三种模式

## 界面预览

- **分屏模式** - 左侧编辑，右侧实时预览（默认）
- **仅编辑模式** - 全屏编辑
- **仅预览模式** - 全屏预览

## 快捷键

| 快捷键 | 功能 |
|--------|------|
| `Ctrl + N` | 新建文件 |
| `Ctrl + O` | 打开文件 |
| `Ctrl + S` | 保存文件 |
| `Ctrl + Shift + S` | 另存为 |
| `Ctrl + P` | 切换预览模式 |
| `Ctrl + E` | 切换编辑/预览模式 |
| `Tab` | 插入两个空格（自动缩进）|

## 安装和运行

### 方式一：直接运行打包好的可执行文件

进入项目目录下的 `release/MarkdownEditor-win` 文件夹，双击 `Markdown Editor.exe` 即可运行：

```
release/MarkdownEditor-win/Markdown Editor.exe
```

### 方式二：开发模式运行

1. 确保已安装 [Node.js](https://nodejs.org/) (版本 18 或更高)

2. 进入项目目录：
```bash
cd MarkdownEditor
```

3. 安装依赖：
```bash
npm install
```

4. 启动应用（需要先构建）：
```bash
npm run electron:dev
```

### 方式三：打包为可执行文件

1. 安装依赖：
```bash
npm install
```

2. 打包 Windows 版本：
```bash
npm run electron:build
```

打包完成后，会在 `release` 目录下生成可执行文件。

## 项目结构

```
MarkdownEditor/
├── electron/                 # Electron 主进程
│   ├── main.cjs            # 主进程代码
│   └── preload.cjs         # 预加载脚本
├── src/                    # React 源代码
│   ├── components/         # React 组件
│   │   ├── EditorLayout.tsx
│   │   ├── MarkdownPreview.tsx
│   │   ├── MonacoEditor.tsx
│   │   ├── ThemeToggle.tsx
│   │   ├── Titlebar.tsx
│   │   └── Toolbar.tsx
│   ├── store/             # Zustand 状态管理
│   │   └── editorStore.ts
│   ├── hooks/             # React Hooks
│   │   └── useIPCEvents.ts
│   ├── App.tsx            # 主应用组件
│   ├── main.tsx          # 入口文件
│   └── index.css         # 全局样式
├── index.html             # HTML 入口
├── package.json           # 项目配置
├── vite.config.ts         # Vite 配置
└── tailwind.config.js    # Tailwind 配置
```

## 技术栈

- **Electron** - 桌面应用框架
- **React 18** - UI 框架
- **TypeScript** - 类型安全
- **Vite** - 构建工具
- **Monaco Editor** - VS Code 同款编辑器
- **Zustand** - 轻量级状态管理
- **Tailwind CSS** - 原子化 CSS 框架
- **marked** - Markdown 解析器

## 支持的 Markdown 语法

- 标题（H1-H6）
- 段落和换行
- 粗体和斜体
- 删除线
- 列表（有序和无序）
- 任务列表（GFM）
- 链接和图片
- 代码块和行内代码
- 引用块
- 表格
- 水平分割线

## 开发计划

- [ ] 支持文件拖放打开
- [ ] 导出为 PDF
- [ ] 导出为 HTML
- [ ] 图片粘贴上传
- [ ] 多标签页支持
- [ ] 搜索和替换功能

## 许可证

MIT License

## 作者

Created with ❤️ by OpenCode

---

**提示**：本应用使用 Monaco Editor，需要联网加载编辑器资源，之后可以离线使用。