Atom保存时自动格式化需同时满足四条件:语法识别正确(右下角显示对应grammar)、语言专属beautify_on_save开关开启、CLI工具(如js-beautify)通过apm安装并重启Atom、文件编码为UTF-8;缺一不可,且无全局开关,须在atom-beautify设置中逐语言勾选。

保存时自动格式化不是装完插件就生效,必须同时满足语言识别正确、对应语言开关开启、CLI 工具就位、编码为 UTF-8 这四个硬性条件,缺一不可。
atom-beautify 的 Beautify On Save 必须按语言单独勾选
这个开关不存在“全局启用”选项,JavaScript 开了,CSS 没开,保存 .css 文件就完全静默。常见错误是只在顶部勾了总开关,却没往下滚动到具体语言区块里再操作。
- 路径:Settings → Packages →
atom-beautify→ Settings → 滚动到底部「Language Specific Options」 - 逐个展开
javascript、css、html、vue等区块,每个都手动勾选Beautify On Save -
.vue文件默认被识别为text.html.basic,<script></script>块不会触发 JS 格式化;需右下角手动切 grammar 为Vue Component,或在 Config → Core → File Types 中添加映射:"*.vue": ["source.vue"]
prettier-atom 的 Format on Save 与 linter-eslint 冲突
prettier-atom 默认优先级更高,一旦和 linter-eslint 共存且后者开了 Fix on save,就会出现格式反复跳动、光标错位甚至保存后内容回退——这不是 bug,是两个插件在抢 core:save 钩子。
- 必须进
linter-eslint设置 → 关掉Fix on save - prettier-atom 不读
.prettierrc以外的配置,.eslintrc里要加eslint-config-prettier,并开启插件内的 ESLint Integration - 文件扩展名必须严格匹配插件设置里的
File Extensions列表(如["js", "jsx", "ts"]),写成.js(带点)就失效
右下角 grammar 显示 Plain text 就等于没配置
Atom 完全不看文件后缀,只认右下角显示的 grammar。显示 Plain text、Source 或 Auto 时,所有格式化插件都会跳过,连日志都不打。
- 手动点击右下角文字 → 从下拉菜单中选对类型(如
JavaScript (JSX)、CSS、Vue Component) -
.jsx、.svelte、Dockerfile等冷门类型需在 Config → Core → File Types 中手动加映射:"Dockerfile": ["source.dockerfile"] - 切换 grammar 后,需对文件做微小改动(比如加空格再删掉)再保存,才能触发格式化逻辑
beautifier not found 报错别 npm install
atom-beautify 是调度器,不自带任何格式化引擎;prettier-atom 依赖本地 prettier 可执行文件。报这个错,90% 是因为用了 npm install -g,而 Atom GUI 启动时根本找不到 shell 的 PATH。
- atom-beautify:运行
apm install js-beautify(不是npm),装完必须重启整个 Atom 进程 - prettier-atom:在插件设置页填绝对路径,如
/usr/local/bin/prettier;在 DevTools Console 运行require.resolve('prettier')验证是否可加载 - 文件编码必须是 UTF-8:右下角点击编码名 → 选
UTF-8;否则中文注释或 BOM 字符会导致格式化静默中断
最容易被忽略的是:即使所有开关都开了、CLI 工具也装了、语法识别也对了,只要文件编码不是 UTF-8,atom-beautify 就安静跳过,prettier-atom 则可能直接报错或输出乱码——它不会提醒你,只会不干活。

















