注: 本文摘自 黑火巨雷 - 简书

1. 在工作目录下建立.jsbeautifyrc文件

官方文档

{
"brace_style": "none,preserve-inline",
"indent_size": 2,
"indent_char": " ",
"jslint_happy": true,
"unformatted": [""],
"css": {
"indent_size": 2
}
}

注释

  • brace_style,格式风格,详见官方说明(为避免和eslint默认检查冲突,建议此属性设置为 none,preserve-inline)
  • indent_size,缩进长度(为避免和eslint默认检查冲突,建议此属性设置为 2)
  • indent_char,缩进填充的内容(充满♂)
  • jslint_happy:true,若你要搭配jslint使用,请开启此选项
  • unformatted:["a","pre"],这里放不需要格式化的标签类型。注意 template 也是默认不格式化的,.vue 的template 标签如果需要格式化请在 .jsbeautifyrc 重新定义不带 template 的声明属性

2. 启用保存时自动

在VSCode的配置文件里添加 editor.formatOnSave:true 即可实现保存时自动格式化

3. 快捷键

在 VS Code 的键盘快捷方式文件里添加

{
"key": "cmd+b", // 自己定键位
"command": "HookyQR.beautify",
"when": "editorFocus"
}

VSCode - Beautify插件配置的更多相关文章

  1. VSCode - Beautify 插件配置

    1. 在工作目录下建立.jsbeautifyrc文件 官方文档 { "brace_style": "none,preserve-inline", "i ...

  2. VSCode保存插件配置并使用 gist 管理代码片段

    setting sync 保存配置 由于公司和家里都使用 VSCode 作为主要编辑器,同步配置是最紧要的.VSCode 提供了setting sync插件,很方便我们同步插件配置.引用网上教程: 在 ...

  3. clojure开发环境配置git, vscode+Calva插件配置

    万事开头难,全是犄角旮旯的细节. 1 安装lein 参见 https://www.cnblogs.com/xuanmanstein/p/10504401.html 2 创建工程 lein 参考http ...

  4. VsCode 格式化插件配置

    Beautify 1.在工作目录下建立.jsbeautifyrc文件: { "brace_style": "none,preserve-inline", &qu ...

  5. vscode 插件配置指北

    Extension Manifest 就像 chrome 插件使用 manifest.json 来管理插件的配置一样,vscode 的插件也有一个 manifest,而且就叫 package.json ...

  6. vscode 常用插件安装

    设置中文语言使用快捷键[Ctrl+Shift+P],弹出的搜索框中输入[configure language],然后选择搜索出来的[Configure Display Language],locale ...

  7. vscode编辑器自定义配置

    { //删除文件确认 "explorer.confirmDelete": false, // 主题 "workbench.iconTheme": "v ...

  8. VsCode 常用插件清单

    插件离线安装说明 在一些内网开发环境中,无法做到在线安装,这个时候就需要对插件进行离线安装 了 打开 VSCode 插件市场网址 Extensions for the Visual Studio fa ...

  9. vscode编写插件详细过程

    前言 之前编写了一个vscode插件用vscode写博客和发布,然后有园友要求写一篇来介绍如何开发一个vscode扩展插件,或者说介绍开发这个插件的过程.然而文章还没有写,园子里面已经有人发布一个文章 ...

随机推荐

  1. 【Redis】Redis 事务

    Redis 事务介绍 Redis 事务可以一次执行多个命令, 并且带有以下三个重要的保证: 批量操作在发送 EXEC 命令前被放入队列缓存. 收到 EXEC 命令后进入事务执行,事务中任意命令执行失败 ...

  2. 浏览器低延时播放监控摄像头RTSP海康大华硬盘录像机NVR视频(EasyNVR播放FLV视频流)

    背景描述 EasyNVR的使用者应该都是清楚的知道,EasyNVR一个强大的功能就是可以进行全平台的无插件直播.主要原因在于rtsp协议的视频流(默认是需要插件才可以播放的)经由EasyNVR处理后可 ...

  3. 使用adb命令控制anroid手机

     adb工具即Android Debug Bridge(安卓调试桥) tools.它就是一个命令行窗口,用于通过电脑端与模拟器或者真实设备交互.在某些特殊的情况下进入不了系统或者需要自动化测试的时候, ...

  4. [LeetCode] 195. Tenth Line 第十行

    Given a text file file.txt, print just the 10th line of the file. Example: Assume that file.txt has ...

  5. Python虚拟环境Virtualen简单使用

    安装pip 使用脚本安装和升级pip 要安装或升级pip,需要下载 get-pip.py. 地址:https://bootstrap.pypa.io/get-pip.py 然后运行以下命令 (需要管理 ...

  6. git删除远程.idea目录

    git删除远程.idea目录 1. 登录 Administrator@USER-20180708AB MINGW32 / (master) $ git config --global user.nam ...

  7. QT笔记--组合框

    1 数据项 (1)位置 index 第一项位0 (2)文本text 这一项的显示值 (3) 关联数据,每一项可以关联一个数据比如整数或者文本类型数据 2 手工添加项 (1)additem:新数据项附加 ...

  8. docker安装+docker-compose

    1.docker安装 yum install -y yum-utils device-mapper-persistent-data yum-config-manager --add-repo http ...

  9. 没有索引导致的DIRECT PATH READ

    5月20号下午4-5点,某项目组进行数据入库作业,作业人员反映入库速度很慢.在16:30和16:50分别采集了快照,并根据两个快照得到AWR报告. 直接看TOP 5 EVENTS,这是数据库问题诊断的 ...

  10. 利用js来画图形(例如:条状图,圆饼图等)

    背景:java开发的过程中,需要对数据进行可视化,这样方便客户理解此时的数据状态 语言:java,js,window7,echarts包文件 sample的例子下面的参照 https://www.ec ...