vscode格式化vue文件配置
【代码】vscode格式化vue文件配置。
·
vscode格式化vue2项目的常用配置,如下:
插件:
- Vue VSCode Snippets
- Vetur
- Prettier
- ESLint
默认格式化:vuter
设置:
{
"vetur.validation.template": false,
// vscode默认启用了根据文件类型自动设置tabsize的选项
"editor.detectIndentation": false,
// 重新设定tabsize
"editor.tabSize": 2,
// #括号成对显示
"editor.bracketPairColorization.enabled": true,
// #去掉代码结尾的分号
"prettier.semi": false,
// #使用带引号替代双引号
"prettier.singleQuote": true,
// #这个按用户自身习惯选择
"vetur.format.defaultFormatter.html": "js-beautify-html",
// #vue组件中html代码格式化样式
"vetur.format.defaultFormatterOptions": {
"js-beautify-html": {
"wrap_attributes": "force-aligned" // 属性分行对齐
// "wrap_attributes": "auto" // 属性在一行显示
// "wrap_attributes": "force",
// "wrap_attributes": "force-aligned",
// "wrap_attributes": "force-expand-multiline"
}
},
"editor.mouseWheelZoom": true,
"explorer.confirmDelete": false,
"git.enableSmartCommit": true,
"workbench.sideBar.location": "left",
"breadcrumbs.enabled": true,
"workbench.iconTheme": "material-icon-theme",
"workbench.productIconTheme": "fluent-icons",
// 保存时修复eslint错误
"editor.codeActionsOnSave": {
"source.fixAll.eslint": false
},
"editor.snippetSuggestions": "top",
"[vue]": {
"editor.defaultFormatter": "octref.vetur"
},
"[javascript]": {
"editor.defaultFormatter": "esbenp.prettier-vscode"
},
"[jsonc]": {
"editor.defaultFormatter": "esbenp.prettier-vscode"
},
"editor.formatOnSave": true
}
效果如下:
更多推荐
已为社区贡献2条内容
所有评论(0)