配置vscode

最新推荐文章于 2025-12-19 14:07:18 发布

原创最新推荐文章于 2025-12-19 14:07:18 发布 · 175 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#vscode #ide #编辑器

本文介绍了如何在VSCode中设置自动保存后格式化代码，详细配置了Prettier用于JavaScript、HTML、CSS和Vue.js文件，展示了如何利用vetur插件实现高效代码风格管理。

{
    "files.autoSave": "afterDelay",
    "fileheader.configObj": {
	"autoAdd": false, 
}
    "editor.fontSize": 16,
    // 每次保存的时候自动格式化
    "editor.formatOnSave": true,
    // script 中使用prettier规则
    "vetur.format.defaultFormatter.js": "prettier",
    // template 中使用js-beautify-html规则
    "vetur.format.defaultFormatter.html": "js-beautify-html", // style less模块中使用prettier规则
    "vetur.format.defaultFormatter.less": "prettier",
    "vetur.format.options.tabSize": 4,
    "vetur.format.defaultFormatterOptions": {
        "js-beautify-html": {
            "wrap_attributes": "auto"
        }, // js中使用的规则
        "prettyhtml": {
            "printWidth": 500,
            "singleQuote": false,
            "wrapAttributes": false,
            "sortAttributes": false
          },
          "prettier": {
            //vue文件里面的js格式
            "semi": false,
            "singleQuote": true,
            "printWidth": 500,
          },
    }, 
    // 针对JS文件，使用prettier
    "[vue]": {
        "editor.defaultFormatter": "octref.vetur"
    },
    "workbench.colorTheme": "Default Dark+",
    "workbench.iconTheme": "vscode-icons",
    "prettier.embeddedLanguageFormatting": "off",
    "prettier.proseWrap": "never",
    "cssrem.rootFontSize": 192,
}