一款纯前端、零依赖的 SQL 编辑器，单个 HTML 文件即可运行，无需安装任何环境。
双击 sql-editor.html，在浏览器中打开即可使用。
⚠️ 此方式下，配置文件无法自动加载（浏览器安全限制），需手动点击工具栏的 📁 加载 按钮导入。
将 sql-editor.html 和配置文件放在同一目录，启动本地服务器后访问：
# Python 3
python3 -m http.server 8080
# 访问 http://localhost:8080/sql-editor.html本地服务器方式下，编辑器启动时会自动加载配置文件，无需手动导入。
编辑器通过配置文件识别数据库表结构，从而提供自动补全功能。
编辑器启动时按以下顺序自动查找，找到有效文件即停止：
postgres.cfgpostgresql.cfg
两个文件格式完全相同，任选其一放在与 HTML 同目录即可。
每行定义一张表，格式为：
表名:字段1:类型1,字段2:类型2,字段3:类型3
以 # 开头的行为注释，会被忽略。
# 用户表
users:id:INTEGER,name:VARCHAR(100),email:VARCHAR(255),created_at:TIMESTAMP,status:VARCHAR(20)
# 订单表
orders:id:INTEGER,user_id:INTEGER,amount:DECIMAL(10,2),status:VARCHAR(20),created_at:TIMESTAMP
# 商品表
products:id:INTEGER,name:VARCHAR(200),price:DECIMAL(10,2),category:VARCHAR(50),stock:INTEGER
| 方式 | 操作 |
|---|---|
| 自动加载 | 使用本地服务器时，启动后自动读取同目录的配置文件 |
| 手动导入 | 点击工具栏 📁 加载 按钮，选择本地 .cfg 文件 |
| 界面配置 | 点击工具栏 ⚙️ 配置 按钮，在弹窗中编辑表结构，保存后自动下载配置文件 |
配置加载成功后，底部状态栏会显示已识别的表名列表。
在表名或别名后输入 .，自动弹出该表的字段列表；继续输入字母可按首字母过滤。
SELECT users.▌ -- 弹出 users 表的全部字段
SELECT users.na▌ -- 只显示 users 表中以 "na" 开头的字段（如 name）
SELECT u.▌ -- 弹出别名 u 对应表的字段（需在 FROM 中定义别名）在以下 SQL 关键字后输入时，自动弹出匹配的表名列表：
| 关键字 | 示例 |
|---|---|
FROM |
SELECT * FROM u▌ |
JOIN / LEFT JOIN / RIGHT JOIN / INNER JOIN |
FROM users JOIN o▌ |
INSERT INTO |
INSERT INTO ord▌ |
UPDATE |
UPDATE pro▌ |
DELETE FROM |
DELETE FROM u▌ |
CREATE TABLE |
CREATE TABLE new▌ |
ALTER TABLE |
ALTER TABLE u▌ |
DROP TABLE |
DROP TABLE o▌ |
输入 2 个及以上字母时，自动匹配 SQL 关键字候选项。
SE▌ -- 候选：SELECT、SET
WH▌ -- 候选：WHERE
OR▌ -- 候选：ORDER、OR选中后自动补全关键字并追加空格，光标就位。
| 按键 | 操作 |
|---|---|
↓ / ↑ |
在候选项中上下移动 |
Enter 或 Tab |
插入选中的候选项 |
Esc |
关闭补全列表 |
| 鼠标点击 | 直接插入该项 |
点击工具栏 🔍 查找 或按 Ctrl+F，在编辑器右上角弹出查找面板：
- 实时显示匹配数量（如
2 / 5） ↑/↓按钮在匹配项之间导航，Enter下一个，Shift+Enter上一个- 区分大小写 和 全词匹配 选项
Esc关闭面板，焦点自动回到编辑器
点击工具栏 ↔ 替换 或按 Ctrl+H，展开替换行：
- 替换：替换当前选中的匹配项并跳到下一个
- 全部替换：一次性替换全部匹配项
点击工具栏 ✨ 格式化 或按 Ctrl+Shift+F，对当前 tab 中的 SQL 进行格式化：
- 所有 SQL 关键字转为大写
FROM、WHERE、JOIN、GROUP BY、ORDER BY、HAVING、LIMIT等子句各占一行AND/OR在 WHERE 条件下自动缩进 2 格- 字符串字面量内容不受影响
格式化前：
select u.id,u.name,o.amount from users u left join orders o on u.id=o.user_id where u.status='active' and o.amount>100 order by o.amount desc格式化后：
SELECT u.id,u.name,o.amount
FROM users u
LEFT JOIN orders o
ON u.id=o.user_id
WHERE u.status='active'
AND o.amount>100
ORDER BY o.amount desc| 操作 | 按钮 | 快捷键 |
|---|---|---|
打开 .sql 文件到当前 tab |
📂 打开 | Ctrl+O |
将当前 tab 保存为 .sql 文件 |
💾 保存 | Ctrl+S |
打开文件时，文件名会自动设置为当前 tab 的名称。
- 点击工具栏右侧的 + 新建标签页
- 点击标签页上的 × 关闭标签页（至少保留一个）
- 双击标签页名称可重命名
- 所有标签页内容自动保存到浏览器本地存储，刷新页面不丢失
点击工具栏的 🎨 主题 按钮，可在 7 种主题之间切换：
| 主题 | 风格 |
|---|---|
| 默认 | 深色（VS Code 风格） |
| 纯白 | 亮色 |
| 护眼绿 | 绿色护眼 |
| 护眼黄 | 黄色护眼 |
| 暗蓝 | GitHub 深色风格 |
| 暗紫 | 紫色深色 |
| 高对比 | 高对比度无障碍 |
主题选择会自动保存，下次打开仍生效。
| 快捷键 | 功能 |
|---|---|
Ctrl+E / ⌘+E |
复制上一行到当前行 |
Ctrl+D / ⌘+D |
删除当前行 |
Ctrl+/ / ⌘+/ |
切换行注释（--），支持多行选中 |
Tab（无补全时） |
插入 2 个空格缩进 |
Tab（有选中内容） |
对所有选中行增加缩进 |
Shift+Tab |
对所有选中行减少缩进 |
( 或 [ |
自动补全右括号；有选中内容时包裹选中内容 |
| 快捷键 | 功能 |
|---|---|
Ctrl+F / ⌘+F |
打开查找面板 |
Ctrl+H / ⌘+H |
打开替换面板 |
Ctrl+G / ⌘+G |
跳转到指定行号 |
| 快捷键 | 功能 |
|---|---|
Ctrl+S / ⌘+S |
保存当前 tab 为 .sql 文件 |
Ctrl+O / ⌘+O |
打开 .sql 文件 |
Ctrl+Shift+F / ⌘+Shift+F |
格式化当前 SQL |
拖动编辑区底部的 拖拽条，可上下调整编辑区高度。调整后的高度自动保存，刷新页面仍保持。
编辑器底部状态栏实时显示：
- 光标位置：当前所在行号和列号（如
Line 5, Col 12） - 已加载表：当前识别到的所有表名
sql-editor.html # 编辑器主体，所有功能均在此文件中
postgres.cfg # 表结构配置文件（或 postgresql.cfg），与 HTML 同目录放置