vscode 插件 Path Autocomplete ,Auto Close Tag ,Prettier - Code formatter

配置路径提示的插件: Path Autocomplete

    //在settings.json 里添加
    //导入文件时是否携带文件的拓展名
    "path-autocomplete.extensionOnImport": true,
    //配置 @ 的路径提示
    "path-autocomplete.pathMappings": {
      "@":"${folder}/src"
    },

自动闭合标签插件: Auto Close Tag

ESLint 插件 :它可以在保存文件的时候，遵循 ESLint 的语法规则，自动对代码进行格式化。

打开 vscode 的 settings.json 配置文件，新增如下的配置节点：
// ESLint 插件的配置
"editor.codeActionsOnSave": {
  "source.fixAll": true,
},

Prettier - Code formatter 插件

settings.json 配置文件，新增如下的配置节点：
 "prettier.configPath": "C:\\Users/xxxx/.prettierrc",
 "eslint.alwaysShowStatus": true,
   "prettier.tabWidth": 2, // 缩进字节数
 // 在对象或数组最后一个元素后面是否加逗号
  "prettier.trailingComma": "none",
  //句尾添加分号
  "prettier.semi": false,
  // 每行文字个数超过此限制将会被迫换行
  "prettier.printWidth": 200,
  //使用单引号替换双引号
  "prettier.singleQuote": true,
 //(x) => {} 箭头函数参数只有一个时是否要有小括号。avoid：省略括号
  "prettier.arrowParens": "avoid",
  // 设置.vue文件中,HTML代码格式化插件
  "vetur.format.defaultFormatter.html": "js-beautify-html",
  "vetur.ignoreProjectWarning": true,
  "vetur.format.defaultFormatterOptions": {
    "prettier": {
      "trailingComma":"none",
      "semi":false,
      "singleQuote":true,
      "arrowParens":"avoid",
      "printWidth":200
    },
    "js-beautify-html": {
      "wrap_attributes":false
    }
  },

在C:\Users/xxx/.prettierrc文件里的代码是{"trailingComma":"none","semi":false,"singleQuote":true,"printWidth":200}

文件没有的话需要自己手动创建

右键点击 设置 .js文件和.vue文件 格式化文档方式的默认值为 Prettier