xDocxDoc
AI
前端
后端
iOS
Android
Flutter
AI
前端
后端
iOS
Android
Flutter
  • 关于

    • Prettier
    • 构建并强制执行
    • Prettier vs. Linters
    • 选项设计原理
    • 设计理念
  • 使用

    • 安装指南
    • 忽略代码
    • precommit
    • 插件
    • CLI
    • API
    • Browser
    • CI
  • 配置 Prettier

    • options
    • Configuration File
    • 共享配置
  • Editors

    • 编辑器集成
    • WebStorm 设置
    • Vim 配置指南
    • 监视文件变更
  • Misc

    • 技术实现细节
    • 生态
    • 企业解决方案

编辑器集成

要充分发挥 Prettier 的优势,建议在编辑器中运行它。

若您的编辑器不支持 Prettier,可改用watching-files.md。

注意! 必须在每个项目中install.md Prettier,以确保项目使用正确的 Prettier 版本。

Visual Studio Code

通过扩展侧边栏安装 prettier-vscode(扩展名为 "Prettier - 代码格式化工具")。https://github.com/prettier/prettier-vscode。

如需切换格式化程序开关状态,请安装 https://marketplace.visualstudio.com/items?itemName=tombonnike.vscode-status-bar-format-toggle。

Emacs

参考 https://github.com/prettier/prettier-emacs 代码库或 https://github.com/jscheid/prettier.el。https://github.com/raxod502/apheleia 插件包支持包括 Prettier 在内的多种代码格式化工具。

Vim

https://github.com/prettier/vim-prettier 是专为 Prettier 设计的 Vim 插件。https://github.com/sbdchd/neoformat、https://github.com/w0rp/ale 和 https://github.com/neoclide/coc-prettier 是支持 Prettier 的多语言 Vim 代码检查/格式化插件。

详细配置参见 vim.md。

Helix

可通过 https://docs.helix-editor.com/languages.html#language-configuration(如 languages.toml)指定格式化程序,该配置将优先于任何语言服务器生效。

具体设置参考 https://github.com/helix-editor/helix/wiki/External-formatter-configuration#prettier。

Sublime Text

通过 Package Control 安装 https://packagecontrol.io/packages/JsPrettier 插件实现支持。

JetBrains WebStorm/PHPStorm/PyCharm...

参见 webstorm.md。

Visual Studio

安装 https://github.com/madskristensen/JavaScriptPrettier。

Espresso

用户可安装 https://github.com/eablokker/espresso-prettier 插件。


总结

  1. 跨编辑器支持:主流编辑器(VS Code/Vim/Emacs 等)均有专用插件或配置方案
  2. 工具链集成:支持通过文件监视器实现自动化格式化,或搭配 Apheleia/ALE 等多功能插件
  3. 项目级版本控制:强调必须本地安装 Prettier,避免版本冲突问题
  4. 配置优先级:部分编辑器(如 Helix)支持通过配置文件覆盖默认行为
  5. 交互增强:提供快捷开关扩展(如 vscode-status-bar-format-toggle)优化工作流
最后更新: 2025/8/26 10:07
Next
WebStorm 设置