Sublime如何实现代码的自动格式化？ (Prettier插件配置)

sublime Text 需通过 Package Control 安装 jsPrettier 插件并配置 prettier_cli_path 路径才能启用 Prettier 自动格式化，支持保存时自动格式化及快捷键触发，且需注意 PATH 环境差异问题。

sublime text 本身不内置 Prettier 支持，必须通过 Package Control 安装插件并手动绑定 Prettier CLI 才能实现自动格式化。

安装 JsPrettier 插件

这是 Sublime 上最稳定、适配性最好的 Prettier 封装插件，它不依赖 node.js 内置环境，而是调用你本地已安装的 prettier 命令行工具。

• 确保已通过 npm install -g prettier 或 yarn global add prettier 全局安装了 prettier
• 按 Ctrl+Shift+P（windows/linux）或 Cmd+Shift+P（macos）打开命令面板，输入 Package Control: Install Package 回车
• 搜索并安装 JsPrettier（注意不是 Prettier 或 SublimeLinter-prettier）
• 安装后无需重启，但建议确认终端能直接运行 prettier --version

配置 prettier_cli_path 路径

如果 Sublime 找不到全局 prettier，会报错 JsPrettier Error: Cannot find module 'prettier' 或直接无反应——这通常是因为 Sublime 的 PATH 和终端不一致，尤其是 macOS 使用 zsh/bash 启动时。

• 打开 Preferences → Package Settings → JsPrettier → Settings
• 在右侧用户设置中添加：

  {   "prettier_cli_path": "/usr/local/bin/prettier" }

• 路径可通过终端执行 which prettier 确认；macOS M1 用户常见路径是 /opt/homebrew/bin/prettier
• Windows 用户路径类似 C:\Users\\AppData\Roaming\npm\prettier.cmd，注意双反斜杠

启用保存时自动格式化

JsPrettier 默认不自动格式化，需显式开启，并且仅对支持的语言（如 .js、.jsx、.ts、.vue 等）生效。

• 在同个 JsPrettier → Settings 用户配置中加入：

  {   "auto_format_on_save": true,   "auto_format_on_save_excludes": ["*/node_modules/*", "*/dist/*"],   "custom_file_extensions": [     "js", "jsx", "ts", "tsx", "css", "scss", "json", "graphql", "mdx", "vue"   ] }

• auto_format_on_save_excludes 强烈建议设置，否则保存 node_modules 下文件可能卡死
• 若只想对某类文件生效（比如只格式化 .ts），可删掉其他扩展名，避免误触非 JS/TS 文件

快捷键与临时禁用

自动保存格式化有时会干扰调试（比如想暂时保留未缩进的代码块），此时需要快速触发/跳过。

• 默认格式化快捷键是 Ctrl+Alt+F（Windows/Linux）或 Cmd+Alt+F（macOS）
• 想临时跳过本次保存格式化？按住 Alt 键再按 Ctrl+S（Windows）或 Cmd+S（macOS），即可绕过 auto_format_on_save
• 如果快捷键冲突，可在 Preferences → Key Bindings 中查到 js_prettier 相关条目并修改

真正容易被忽略的是：Sublime 的 PATH 继承自启动方式。从桌面图标启动时，它往往看不到 shell 配置的 PATH，所以即使 which prettier 在终端里有结果，Sublime 仍可能找不到——这时候硬编码 prettier_cli_path 是唯一可靠解法。