vscode设置 如何 格式化 vue.js 文件

vscode中vue格式化的方式

    • 步骤1
    • 步骤2
    • 步骤三

步骤1

下载vscode插件
点击右边 搜索ESLint 和 Vetur 插件安装
vscode设置 如何 格式化 vue.js 文件_第1张图片

步骤2

vscode用户配置
要使ESLint正常工作,更改VSCode首选项。转到File > Preferences > Settings 并编辑用户设置文件,添加以下配置:

	"eslint.autoFixOnSave":true,
    "vetur.format.defaultFormatter.js": "vscode-typescript",
    "vetur.format.defaultFormatter.html": "js-beautify-html",
    "javascript.format.insertSpaceBeforeFunctionParenthesis": true,

{
 "eslint.validate": [
    {
      "language": "vue",
      "autoFix": true
    },
    {
      "language": "html",
      "autoFix": true
    },
    {
      "language": "javascript",
      "autoFix": true
    }
  ]
}

步骤三

保存重启
新建vue 文件
Ctrl/S 看一下效果
或者右键这 两个命令
一次全部格式化
这两个命令 执行效果有差异
Ctrl+shift+f 对HTML文件也格式化
vscode设置 如何 格式化 vue.js 文件_第2张图片

你可能感兴趣的:(前端工具)