sublime怎么配置prettier插件 _sublime Prettier插件配置方法_网络技术

sublime怎么配置prettier插件 _sublime Prettier插件配置方法

发布时间 - 2025-10-20 00:00:00 点击率：次

首先安装JsPrettier插件并确保Node.js与Prettier已安装，再通过Package Control搜索安装JsPrettier；接着配置prettier_cli_path和node_path路径，开启auto_format_on_save选项；最后可通过右键菜单或快捷键Ctrl+Alt+F格式化代码，保存时可自动执行。

要在 Sublime Text 中配置 Prettier 插件实现代码格式化，需通过 Package Control 安装插件并正确设置 Node.js 环境与 Prettier 路径。以下是具体步骤。

安装 Prettier 插件

Sublime Text 本身不自带 Prettier 支持，需要借助社区插件，常用的是 JsPrettier。

打开 Sublime Text，按下 Ctrl+Shift+P（Windows/Linux）或 Cmd+Shift+P（Mac）调出命令面板
输入 "Install Package" 并选择 "Package Control: Install Package"
搜索 JsPrettier 并点击安装

确保系统已安装 Node.js 和 Prettier

JsPrettier 依赖 Node.js 和 Prettier 命令行工具。

确认已安装 Node.js：在终端运行 node -v 查看版本
全局安装 Prettier：npm install -g prettier
也可在项目本地安装：npm install --save-dev prettier

配置 JsPrettier 插件

安装完成后需配置插件路径和格式化选项。

进入菜单栏 Preferences > Package Settings > JsPrettier > Settings
修改用户配置文件（右侧），常见关键配置如下：

{ "prettier_cli_path": "/usr/local/bin/prettier", "node_path": "/usr/local/bin/node", "auto_format_on_save": true, "allow_inline_formatting": false, "auto_format_on_save_excludes": [ "*/node_modules/*", "*/package.json" ] }

说明：

prettier_cli_path：Prettier 可执行文件路径，可通过 which prettier（Mac/Linux）或 where prettier（Windows）查看
node_path：Node 可执行文件路径，用 which node 查询
auto_format_on_save：保存时自动格式化，建议开启

使用 Prettier 格式化代码

配置完成后，可按以下方式使用：

右键编辑区，选择 "Format Code with Prettier"
使用快捷键（默认为 Ctrl+Alt+F 或 Cmd+Option+F）
若启用了保存自动格式化，保存文件时会自动执行

基本上就这些。只要 Node 和 Prettier 正确安装，路径配置无误，插件就能正常工作。项目中也可以添加 .prettierrc 配置文件来自定义格式规则。不复杂但容易忽略环境路径问题。

# linux # sublime # js # node.js # json # node # windows # npm # 工具 # mac # win # format

相关栏目：【网站优化151355 】【网络推广146373 】【网络技术251813 】【 AI营销90571 】

上一篇：HTML5如何实现渐变色彩边框_HTML5实现渐变色彩边框技

下一篇：HTML图片怎样用HTML5优化_加alt属性符合可访问要求

相关栏目网站优化
网络推广
网络技术
AI营销

最新文章 Sublime怎么一键压缩JS代码 Su sublime如何在搜索中使用正则表达式 Sublime如何设置透明窗口效果 Su mysql如何设计商品表结构_mysql css属性背景图不显示怎么办_通过检查路如何使用Golang实现排序_Golan 农历闰月是怎么回事_为合回归年加一月调整塑造《刺客信条》艾吉奥传奇的编剧离开育碧 1英里等于多少公里 1mile和km的换 css grid布局中行和列是如何定义的 PS批量旋转和翻转图片，快速校正图片方向 C# Swagger UI自定义方法 C OPPO手机九宫格和全键盘怎么切换_OP Go语言如何实现用户登录注册_Golan 1节飞行速度多少公里每小时 1节是多少公纸嫁衣8千子树第五章庙门怎么开启庙门 Laravel 多行数据编辑表单中实现逐明日之后如何提升钓鱼等级明日之后提升钓支付宝怎样查年度账单_支付宝年度账单查看 C# 多线程UI更新Dispatcher

上一篇：HTML5如何实现渐变色彩边框_HTML5实现渐变色彩边框技

下一篇：HTML图片怎样用HTML5优化_加alt属性符合可访问要求