正文：

作为一名前端开发者，代码的整洁性和规范性直接影响开发效率和团队协作。Sublime Text作为一款轻量级且强大的代码编辑器，配合JSBeautifier插件可以轻松实现代码的自动化格式化。本文将手把手教你如何配置JSBeautifier，让你的代码瞬间变得赏心悦目。

1. 安装JSBeautifier插件

首先，确保已安装Sublime Text的包管理器（Package Control）。若未安装，可通过以下步骤操作：
1. 打开Sublime Text，按下Ctrl + \``（或View > Show Console`）调出控制台。
2. 粘贴以下代码并回车：

import urllib.request,os,hashlib; h = 'df21e130d211cfc94d9b0905775a7c0f' + '1e3d39e33b79698005270310898eea76'; pf = 'Package Control.sublime-package'; ipp = sublime.installed_packages_path(); urllib.request.install_opener( urllib.request.build_opener( urllib.request.ProxyHandler()) ); by = urllib.request.urlopen( 'http://packagecontrol.io/' + pf.replace(' ', '%20')).read(); dh = hashlib.sha256(by).hexdigest(); print('Error validating download (got %s instead of %s), please try manual install' % (dh, h)) if dh != h else open(os.path.join( ipp, pf), 'wb' ).write(by)

安装完成后，通过Ctrl + Shift + P调出命令面板，输入Install Package，搜索JsFormat或JSBeautify并安装。

2. 基础配置

插件安装后，需根据个人偏好调整格式化规则。打开Preferences > Package Settings > JSFormat > Settings - User，添加以下配置（示例）：

{
  "e4x": true,
  "indent_size": 2,
  "indent_char": " ",
  "preserve_newlines": true,
  "max_preserve_newlines": 2,
  "brace_style": "collapse-preserve-inline"
}

• indent_size：缩进空格数（推荐2或4）。
• brace_style：大括号换行风格（如collapse表示不换行）。

3. 快捷键绑定

为提高效率，可为格式化操作绑定快捷键。打开Preferences > Key Bindings，在用户配置文件中添加：

[
  { "keys": ["ctrl+alt+f"], "command": "js_format" }
]

按下Ctrl + Alt + F即可一键格式化当前文件。

4. 进阶技巧

4.1 忽略特定文件

在项目根目录创建.jsbeautifyrc文件，可覆盖全局配置。例如：

{
  "ignore": ["vendor/*.js"],
  "html": {
    "end_with_newline": true
  }
}

4.2 与其他插件协同

JSBeautifier可与SublimeLinter等插件配合使用。在.sublimelinterrc中配置：

{
  "linters": {
    "eslint": {
      "format": "jsbeautify"
    }
  }
}

5. 常见问题

• 格式化无效：检查文件语法是否为JavaScript，或尝试重启Sublime Text。
• 配置不生效：确保配置文件为JSON格式，且无语法错误。

通过以上步骤，你的Sublime Text将具备强大的代码美化能力，助你写出更优雅的代码！