VSCode调试TypeScript/JavaScript时如何实现Chrome的代码美化功能？

• 用VSCode自带的格式化功能
  调试时跳转到压缩的库代码文件，点击编辑器右上角的「格式化文档」按钮（或按快捷键Shift + Alt + F），VSCode会自动美化当前压缩代码。如果没生效，检查是否安装了ESLint、Prettier这类JS格式化插件，同时确认设置里配置了默认格式化程序。

• 调试时自动加载源映射
  不少压缩库会附带.map源映射文件，Node.js调试默认会尝试加载这些文件。在VSCode的launch.json调试配置里，确保sourceMaps选项设为true（默认就是开启的）：

  {
    "version": "0.2.0",
    "configurations": [
      {
        "type": "node",
        "request": "launch",
        "name": "Launch Program",
        "program": "${workspaceFolder}/app.js",
        "sourceMaps": true
      }
    ]
  }
  

  这样调试时会直接映射到未压缩的源码，比手动格式化更精准。

• 借助VSCode插件强化美化效果
  安装Prettier - Code formatter这类插件，它能处理各种压缩JS代码，格式化效果更统一。安装后右键点击压缩代码文件，选择「Format Document With」->「Prettier」就能完成美化。

内容的提问来源于stack exchange，提问作者Hauke P.