VSCode使用prettier插件进行格式化配置

1. Beautify不维护了

最近刚换电脑，之前用Vetur+Beautify配置格式化比较多，现在突然发现Beautify不维护了。

于是寻找替代思路。

2. 替代方案

经过一番查找，Vetur+Prettier还不错，所以此处记录下如何配置。

2.1 安装插件

插件市场安装Vetur和Prettier：

2.2 配置Prettier为默认格式化插件

打开setting.json，添加如下一行代码：

// VSCode settings.json
{"[vue]": {"editor.defaultFormatter": "esbenp.prettier-vscode"}
}

2.3 配置Vetur的默认格式化行为

  "vetur.format.defaultFormatter": {"html": "prettier","template": "prettier"},

2.4 格式化行为配置

在项目根目录下建立.prettierrc文件，内容如下：

{"printWidth": 500,"tabWidth": 2,"htmlWhitespaceSensitivity": "ignore","endOfLine": "auto"
}

上述配置含义为:

• 每行最大字符：500
• 缩进字符数：2
• HTML中空格敏感度：忽略
• 换行符类型：自动