自用vscode+prettier+vetur格式化配置

2021-03-12 14:57:44 阅读：805 来源： 互联网

标签：false format vscode js html prettier 格式化 vetur

自用vscode+prettier+vetur格式化配置
本人这里的配置是根据已有项目的代码风格配置的，特点是：
template模板属性不换行，
js代码格式化符合 eslint 格式化要求

{
  // vscode默认启用了根据文件类型自动设置tabsize的选项
  "editor.detectIndentation": false,
  // 重新设定tabsize
  "editor.tabSize": 2,
  // #每次保存的时候自动格式化
  "editor.formatOnSave": false,
  // #每次保存的时
  "editor.codeActionsOnSave": {

  },
  //  #让函数(名)和后面的括号之间加个空格
  "javascript.format.insertSpaceBeforeFunctionParenthesis": true,
  // #这个按用户自身习惯选择
  "vetur.format.defaultFormatter.html": "js-beautify-html",
  // #让vue中的js按编辑器自带的ts格式进行格式化
  "vetur.format.defaultFormatter.js": "vscode-typescript",
  // 格式化 script 标签顶级内容不缩进
  "vetur.format.scriptInitialIndent": false,
  // style 标签顶级内容不缩进
  "vetur.format.styleInitialIndent": false,
  // 忽略自闭合标签
  "prettier.htmlWhitespaceSensitivity": "ignore",
  // 对象最后一个属性是否加 (,) 逗号
  "prettier.trailingComma": "none",
  "html.format.wrapAttributesIndentSize": 2,
  "vetur.format.defaultFormatterOptions": {
    "js-beautify-html": {
      // #vue组件中html代码格式化样式
      "wrap_attributes": "auto", // " // html 标签属性 换行设置[auto|force|force-aligned|force-expand-multiline] [“auto”]
      "wrap_line_length": 0, // 设置多个字符后换行 0 表示忽略
      "end_with_newline": false, // 在文件结尾添加新行
      "semi": false,
      "singleQuote": true
    },
    "prettier": {
      "semi": false,
      "singleQuote": true
    }
  }
}

参考：http://www.hanwenblog.com/post/36.html

标签：false,format,vscode,js,html,prettier,格式化,vetur
来源： https://blog.csdn.net/example440982/article/details/114695422

本站声明： 1. iCode9 技术分享网（下文简称本站）提供的所有内容，仅供技术学习、探讨和分享；
2. 关于本站的所有留言、评论、转载及引用，纯属内容发起人的个人观点，与本站观点和立场无关；
3. 关于本站的所有言论和文字，纯属内容发起人的个人观点，与本站观点和立场无关；
4. 本站文章均是网友提供，不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属；如您发现该文章侵犯了您的权益，可联系我们第一时间进行删除；
5. 本站为非盈利性的个人网站，所有内容不会用来进行牟利，也不会利用任何形式的广告来间接获益，纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。

ICode9

自用vscode+prettier+vetur格式化配置