最近一直使用vscode,项目中也使用了eslint等代码格式化工具，但是自从更新之后标签属性一直换行，查询尝试了多种方法发现都已经不行，纠结好久才搞好，终于觉得编辑器清新了好多

1、需要 command+,；打开设置，搜索wrap 如下选择 代表永不换行

2、插件市场下载插件：Prettier - Code formatter；安装完成之后需要打开settings.json添加如下配置

  "vetur.format.defaultFormatter.html": "js-beautify-html",
  "vetur.format.defaultFormatterOptions": {
    "js-beautify-html": {
      "wrap_line_length": 120,
      "wrap_attributes": "auto",
      "end_with_newline": false
    },
    "prettier": {
      "semi": false, //不使用分号结尾
      "singleQuote": true, //使用单引号
      "eslintIntegration": false //开启 eslint 支持
    }
  },

以上就是为了用prettier个格式化代码，至于格式化规则选择配置在项目根目录的  .prettierrc文件中这里可以配置视野区域的宽度，确保在此宽度不换行，类似tab空格，单双引号，分号结尾，是否开启eslint等等

.prettierrc 根目录文件

{
  "tabWidth": 2,
  "useTabs": false,
  "printWidth": 3000, // 就是这行生效，其他配置主要是为了多人协作规范代码格式，后面开始eslint校验能完美搭配，数字自己调整可以看看效果
  "semi": false,
  "singleQuote": true,
  "arrowParens": "avoid",
  "bracketSpacing": true,
  "endOfLine": "auto",
  "eslintIntegration": false,
  "htmlWhitespaceSensitivity": "ignore",
  "ignorePath": ".gnore",
  "trailingComma": "none"  
}