如何在 Sublime 中使用 Prettier

Prettier 是一款代码格式化工具，它可以格式化多种编程语言的代码，例如 JavaScript、TypeScript、CSS、HTML 等。Sublime 是一款优秀的代码编辑器，本文将介绍如何在 Sublime 中配置并使用 Prettier。

安装 Prettier 插件

首先，需要在 Sublime 中安装 Prettier 插件。可以选择使用 Sublime 的插件管理器 Package Control 进行安装，也可以手动下载安装。

使用 Package Control 安装

1. 打开 Sublime，按下 Ctrl+Shift+P（Windows 和 Linux）或 Command+Shift+P（macOS），调出命令面板。

2. 输入 Package Control: Install Package，回车。

3. 在搜索框中输入 Prettier，找到 Prettier - Code formatter 插件，点击安装。

手动下载安装

1. 手动下载 Prettier 插件，可以在 GitHub 上找到最新的版本。

2. 在 Sublime 中打开菜单 Preferences > Browse Packages，进入 Sublime 的包目录。

3. 把下载的插件解压到包目录下的 User 目录中。

配置 Prettier 插件

安装插件后，需要进行配置才能使用。可以在 Sublime 的配置文件 Preferences > Settings 中添加以下配置：

{
    "auto_format_on_save": true,
    "prettier_cli_path": "/usr/local/bin/prettier",
    "prettier_options": {
        "singleQuote": true,
        "tabWidth": 4
    }
}

以上配置中：

• auto_format_on_save 表示在保存时自动对代码进行格式化。
• prettier_cli_path 表示使用的 Prettier 可执行文件的路径。如果是 Windows 系统，则路径需要使用双斜线和反斜线拼接。
• prettier_options 表示格式化选项，可以根据个人习惯进行修改。

使用 Prettier 插件

配置完成后，就可以使用 Prettier 插件对代码进行格式化了。可以打开一个 JavaScript 文件，输入以下代码：

function add(a,b){
return a+b;
}

然后，按下快捷键 Ctrl+Shift+P（Windows 和 Linux）或 Command+Shift+P（macOS），调出命令面板。在搜索框中输入 Prettier，选择 Prettier: Format Code，回车。

代码将被格式化为：

function add(a, b) {
    return a + b;
}

如果配置了自动格式化，保存文件后代码也会自动格式化。

总结

在 Sublime 中使用 Prettier 插件，可以在编写代码的同时自动格式化代码，提高编码效率和代码质量。只需要简单的配置和操作，就可以体验到 Prettier 带来的便捷和舒适。