代码格式化在线
发布时间:2026-08-30 | 浏览:1
代码格式化工具 把乱糟糟的代码一键排整齐,或反过来压成单行。核心引擎是 Prettier 标准浏览器构建 ——同一套规则覆盖 JavaScript、TypeScript、JSX/TSX、Vue SFC、JSON、CSS/SCSS/LESS、HTML、Markdown、YAML、GraphQL 等主流语言,再叠加 sql-formatter (SQL 12 种方言)和 @prettier/plugin-xml (XML/SVG)两个补位方案。
tabWidth (缩进宽度)、 useTabs (Tab vs 空格)、 printWidth (触发换行的最大行宽)、 semi (行尾分号)、 singleQuote (单引号优先)、 trailingComma (末尾逗号策略)——与 Prettier 官方字段一一对应,换行缩进差异完全可控。SQL 语言额外可选 MySQL、PostgreSQL、T-SQL、BigQuery、Snowflake 等 11 种方言,关键字自动大写、子句对齐。
单栏设计, 粘贴一段代码到空编辑器 即自动识别语言(JSON / JS / SQL / CSS / HTML / Vue / YAML …)并按当前选项格式化,无需先选语言、再点按钮。识别错误时手动切语言下拉,再按 ⌘/Ctrl + Enter 重跑即可。
代码 不会离开浏览器 。Prettier 插件按选中语言 按需动态加载 ,没选过 SQL 就不会拉 SQL 包,首屏轻量。
⌘/Ctrl + Enter — 格式化
⇧⌘ / Shift+Ctrl + Enter — 压缩
美化压缩过的代码 从网上抓来的一行 minified JS/CSS/JSON 难以阅读,一键还原为带缩进的可读格式。
统一团队代码风格 按 Prettier 的规则把分号、引号、末尾逗号、缩进拉齐,避免 PR 里混入风格型 diff。
压缩上线产物 把 JSON 配置、SQL、HTML 片段压成单行,塞进 URL、配置项、字符串字面量里。
排查 SQL 可读性 从日志抓到的一长行 SQL,按关键字换行缩进后,连接和条件一目了然。
本工具就是用的 Prettier 标准浏览器构建 ,核心行为一致—— tabWidth 、 printWidth 、 semi 、 singleQuote 、 trailingComma 等选项都对标官方字段。差异是本工具额外集成了 SQL (sql-formatter)和 XML (@prettier/plugin-xml)。所有处理 纯浏览器本地 完成,不上传代码。
JavaScript/TypeScript/JSX/TSX、Vue/Svelte、JSON、CSS/SCSS/LESS、HTML、Markdown、YAML、GraphQL、XML/SVG、SQL(支持 MySQL/Postgres/T-SQL/BigQuery 等 10+ 方言)、Java、PHP、TOML、.properties、Solidity、Liquid、Lua、Shell(shfmt)、Go(gofmt)、Python(Ruff)、C/C++/C#/Objective-C/Protobuf(clang-format)。
格式化 (format)按行宽和缩进把代码排成 人类可读 的样子。 压缩 (minify)反向——尽量塞成一行、去注释。按语言策略不同: JSON 走 JSON.stringify 最稳; JS/TS 走 Prettier printWidth:∞ 单行; CSS/SQL 走 quote-aware 状态机(字符串内容原样保留); HTML/Vue/XML 只做 Prettier 窄化、 不合并元素之间的空白 ——因为 <span>a</span> <span>b</span> 里的那个空格在渲染时是可见的,正则层面无法安全区分"可丢"和"不可丢"。想要激进的 HTML 体积压缩请另选专用压缩器。
纯文本文件 几 MB 以内 基本秒级完成。Prettier 的 JS/TS parser 对超大源文件会变慢(1 MB+ 可能几秒)。真卡的话先 清空 再分段粘贴,避免一次性处理整份巨型源码。
状态栏会显示 Parser 抛出的错误,通常带 行列号 。常见原因:JS 缺分号/括号不匹配、JSON 含注释或末尾逗号(标准 JSON 不允许)、YAML 缩进不一致、SQL 用了方言特有语法但选了错的 dialect。先按错误位置看上下一两行,90% 问题能直接看出来。