vue中shift+alt+f格式化防止格式掉其它内容

好处就是使得提交记录干净,否则修改一两行代码,习惯性按了一下格式化快捷键,遍地飘红,下次找修改就费时间

1.点击设置图标-设置

2.点击这个转成配置文件

复制代码
{
    "extensions.ignoreRecommendations": true,
    "[vue]": {
        "editor.defaultFormatter": "octref.vetur"
    },
    "editor.fontSize": 13,
    "editor.codeActionsOnSave": {},
    "prettier.endOfLine": "crlf",
    "vetur.format.defaultFormatterOptions": {
        "js-beautify-html": {
            // #vue组件中html代码格式化样式
            "wrap_attributes": "force-aligned", //也可以设置为"auto",效果会不一样
            "wrap_line_length": 200,
            "end_with_newline": false,
            "semi": true,
            "singleQuote": true
        },
        "prettier": {
            //设置分号
            "semi": true,
            //双引号变成单引号
            "singleQuote": false,
            //禁止随时添加逗号,这个很重要。找了好久
            "trailingComma": "none",
            // 单个参数的箭头函数不加括号 x => x
            "arrowParens": "avoid",
        }
    },
    "explorer.confirmDelete": false,
    "window.zoomLevel": 1,
    "editor.formatOnSaveMode": "modificationsIfAvailable"
}
  • 末尾不加逗号
  • 箭头函数不要自己加括号
  • template不要随便改变换行

3.设置vscode的默认格式化工具为Vetur

相关推荐
前端君31 分钟前
实现最大异步并发执行队列
javascript
Nan_Shu_6142 小时前
Web前端面试题(2)
前端
知识分享小能手2 小时前
React学习教程,从入门到精通,React 组件核心语法知识点详解(类组件体系)(19)
前端·javascript·vue.js·学习·react.js·react·anti-design-vue
蚂蚁RichLab前端团队3 小时前
🚀🚀🚀 RichLab - 花呗前端团队招贤纳士 - 【转岗/内推/社招】
前端·javascript·人工智能
孩子 你要相信光3 小时前
css之一个元素可以同时应用多个动画效果
前端·css
萌萌哒草头将军3 小时前
Oxc 和 Rolldown Q4 更新计划速览!🚀🚀🚀
javascript·vue.js·vite
huangql5203 小时前
npm 发布流程——从创建组件到发布到 npm 仓库
前端·npm·node.js
Qlittleboy3 小时前
uniapp如何使用本身的字体图标
javascript·vue.js·uni-app
Days20503 小时前
LeaferJS好用的 Canvas 引擎
前端·开源
小白菜学前端4 小时前
vue2 常用内置指令总结
前端·vue.js