Sublime怎么安装Prettier插件？前端多语言一键美化-sublime-PHP中文网

jsprettier是sublime中唯一稳定支持.prettierrc的prettier插件，需全局安装node.js和prettier cli，显式配置绝对路径的prettier_cli_path与node_path，手动添加ts/tsx等扩展名，并确保文件语法识别正确。

sublime怎么安装prettier插件？前端多语言一键美化

JsPrettier 是唯一能稳定工作的选择，其他叫“Prettier”的插件基本失效或不读 .prettierrc。装完没反应？不是插件问题，而是 Node 环境、路径配置或语法识别没对上。

确认 prettier CLI 已全局安装且路径可访问

Sublime 的 JsPrettier 插件不自带 Prettier，它只负责调用你终端里能跑的 prettier 命令——所以终端里跑不通，Sublime 就一定不动。

在终端执行 prettier --version，必须有输出；若提示 command not found，运行 npm install -g prettier
再执行 which prettier（macOS/Linux）或 where prettier（Windows），拿到绝对路径，比如 /opt/homebrew/bin/prettier 或 C:\Users\XXX\AppData\Roaming\npm\prettier.cmd
node -v 必须 ≥ 14.0.0；同样用 which node 或 where node 查绝对路径，填进配置
Sublime 不继承 shell 的 PATH（比如 ~/.zshrc 里的配置），所以即使终端能跑，Sublime 仍可能找不到命令——必须显式填路径

用 Package Control 安装 JsPrettier，别搜“Prettier”

官方那个名为 Prettier 的插件已多年未更新，Sublime Text 4 下无法加载，也不支持 .prettierrc。必须装 JsPrettier。

按 Ctrl+Shift+P（Win/Linux）或 Cmd+Shift+P（macOS）打开命令面板
输入 Package Control: Install Package，回车
搜 JsPrettier，点击安装（无需重启）
装完立刻进 Preferences → Package Settings → JsPrettier → Settings – User，贴入最小配置

关键配置项必须显式写死，不能留空或靠自动探测

90% 的“静默失败”都卡在这几项上。复制粘贴前，请先核对路径和扩展名：

PigX UI 前端开发

PigX UI Pro 前端开发指南 - Vue 3 + TypeScript + Element Plus。当用户提到 PigX UI、PigX 前端、lgb-mgui 项目、Vue 3 企业级后台开发、Element Plus 后台开发时使用此技能。

下载

"prettier_cli_path"：必须是绝对路径，不能含 ~，不能是 null 或空字符串
"node_path"：同上，指向你系统里实际的 node 可执行文件
"custom_file_extensions"：默认不包含 "ts" 和 "tsx"，必须手动加上，否则 TypeScript 文件完全不会触发格式化
"auto_format_on_save"：设为 true 才能保存即美化；但需配合右下角语法识别为 TypeScript 或 JavaScript，不是 Plain text

推荐最小可用配置：

{
  "auto_format_on_save": true,
  "custom_file_extensions": ["js", "jsx", "ts", "tsx", "json"],
  "prettier_cli_path": "/opt/homebrew/bin/prettier",
  "node_path": "/opt/homebrew/bin/node"
}

TS/JSX/Vue 文件格式化失败？检查语法识别和扩展名匹配

Sublime 不会自动把 .ts 文件当成 TypeScript，也不会把 .vue 当成 HTML/JS 混合体——它只看右下角状态栏显示的语法类型。

右下角显示 Plain text 或 JSX？按 Ctrl+Shift+P 输入 Set Syntax: TypeScript 切换
.vue 文件默认不被 JsPrettier 处理，它只认 html 语法；如需支持，得额外加 "html" 到 "syntaxes" 配置项（但注意：这会让它用 HTML 规则格式化整个 .vue，JS 部分可能错乱）
.tsx 同样依赖 "tsx" 在 "custom_file_extensions" 中，且文件语法必须设为 TypeScript，不是 JavaScript
想让项目级 .prettierrc 生效，必须开 "use_prettierrc": true，关掉 "ignore_project_config": false