可以利用百度提供的格式化工具完成，步骤如下：
1、首先，我们先找一段示例代码，这段代码是没有任何格式和缩进的：
【<html><head>First Page</head><body><p>This is my first page!!!</p></body></html>】
2、接下来，我们打开浏览器，然后进入百度主页，百度主页的网址是http://www.baidu.com；
3、直接在搜索框里输入【HTML格式化】这几个关键字，然后点击【百度一下】按钮；
4、出现百度网页应用输入框；
5、将测试代码复制到白色的框里；
6、点击【格式化】按钮；
已经变成我们想要的格式了，有缩进而且干净整洁。
File ->Preference ->Setting ->搜索setting.json ->Edit in settings.jsonsettings.json
方法1：File ->Preference ->Setting ->搜索setting.json ->Edit in settings.json
settings.json
Setting.json
方法2：File ->Preference ->搜索框输入：files.autoSave
之后能看到 files.autoSave 的可选项有
off : 关闭自动保存（默认）
afterDelay: 延迟xx时间后保存，可在 "files.autoSaveDelay" 中配置延迟时间；
onFocusChange: 编辑器失去焦点时自动保存；
onWindowChange: 窗口失去焦点时(编辑器窗口的切换，桌面窗口的切换)自动保存；
安装 ESLint https://cn.eslint.org/
vscode 中安装 ESLint 插件
然后配置 vscode 的 setting.json
File ->Preference ->User Snippers
vue.json文件，然后添加下面模板
然后新建.vue文件 ，写下vue然后Tap键就能生成什么的模板。
如果没有生成模板只是多了个空格或者生成的是vue标签的话，我们还得设置一下，打开settings.json，添加下面的设置
如果你的Setting.json文件有 "files.associations" 设置的话，请删除，因为他会和上面 emmet.syntaxProfiles 冲突。
files.associations 和 emmet.syntaxProfiles 都是设置html 标签的补全，如果是要用.vue模板补全功能的话，html标签补全我们就用 emmet.syntaxProfiles 来设置。
vue 的开发中 vscode 可装用于开发规范的插件有
Prettier ：规范js
ESLint: 规范js
Vuter: 规范 .vue 文件中 template
stylus: 规范 stylus
注意：以下配置是基于接下来介绍的插件设置的，如果没有安装插件是不会生效的。
或者：
其中：
4.如果使用了stylus，那么vscode安装stylus插件，进行设置，不适用冒号双引号大括号
根目录下创建eslint规则文件 .eslintrc.js
（下面browsers 多了s 正确的为 browser ）
HTML页面的代码如何格式化、整理 解决办法如下:
1、打开Windows——>“Preference(首选项)”
2、在d出的“Preference(首选项)”窗口界面,找到左侧java导航 ---->“editor ”----->“save actions”。
3、在右侧“Save Actions”里找到“Perform the selected actions on save”前打上√,点击“ok”保存。
欢迎分享，转载请注明来源：内存溢出
微信扫一扫
支付宝扫一扫
评论列表（0条）