当前位置:首页 > 经验笔记 > 其他 > 正文内容

VScode格式化HTML代码保持标签属性不换行 配置记录

han32685年前 (2020-11-13)其他10924
{
  // vscode默认启用了根据文件类型自动设置tabsize的选项
  "editor.detectIndentation": false,
  // #值设置为true时,每次保存的时候自动格式化;值设置为false时,代码格式化请按shift+alt+F
  "editor.formatOnSave": false,
  // #每次保存的时候将代码按eslint格式进行修复
  "eslint.autoFixOnSave": true,
  // 添加 vue 支持
  "eslint.validate": [
    "javascript",
    "javascriptreact",
    {
      "language": "vue",
      "autoFix": true
    }
  ],
  //  #让prettier使用eslint的代码格式进行校验
  "prettier.eslintIntegration": true,
  //  #去掉代码结尾的分号
  "prettier.semi": false,
  //  #使用带引号替代双引号
  "prettier.singleQuote": true,
  "prettier.tabWidth": 4,
  //  #让函数(名)和后面的括号之间加个空格
  "javascript.format.insertSpaceBeforeFunctionParenthesis": true,
  // #这个按用户自身习惯选择
  "vetur.format.defaultFormatter.html": "js-beautify-html",
  // #让vue中的js按"prettier"格式进行格式化
  "vetur.format.defaultFormatter.js": "prettier",
  "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
    }
  },
  "[jsonc]": {
    "editor.defaultFormatter": "vscode.json-language-features"
  },
  // 格式化stylus, 需安装Manta's Stylus Supremacy插件
  "stylusSupremacy.insertColons": false, // 是否插入冒号
  "stylusSupremacy.insertSemicolons": false, // 是否插入分号
  "stylusSupremacy.insertBraces": false, // 是否插入大括号
  "stylusSupremacy.insertNewLineAroundImports": false, // import之后是否换行
  "stylusSupremacy.insertNewLineAroundBlocks": false,
  "prettier.useTabs": false,
  "explorer.confirmDelete": false,
  "[javascript]": {
    "editor.defaultFormatter": "vscode.typescript-language-features"
  },
  "[json]": {
    "editor.defaultFormatter": "vscode.json-language-features"
  },
  "diffEditor.ignoreTrimWhitespace": false,
  "workbench.startupEditor": "welcomePage",
  "liveServer.settings.donotShowInfoMsg": true,
  "files.associations": {
    "*.cjson": "jsonc",
    "*.wxss": "css",
    "*.wxs": "javascript"
  },
  "emmet.includeLanguages": {
    "wxml": "html"
  },
  "minapp-vscode.disableAutoConfig": true,
  "workbench.editorAssociations": {
    "*.ipynb": "jupyter.notebook.ipynb"
  },
  "git.enableSmartCommit": true,
  "editor.tabSize": 2,
  "[vue]": {
    "editor.defaultFormatter": "octref.vetur"
  },
  "files.autoSave": "afterDelay",
  "git.confirmSync": false, // 两个选择器中是否换行
}


扫描二维码推送至手机访问。

版权声明:本文由瀚文博客发布,如需转载请注明出处。

本文链接:https://www.hanwenblog.com/post/36.html

分享给朋友:

相关文章

Windows10自动登录的设置方法 Windows10怎么自动登录

Windows10自动登录的设置方法:  打开CMD:  1、在运行中执行 netplwiz 命令;  2、此时将自动打开「高级用户账户控制面板」,在此你可以选中需要自动登录的账户名称 — 取消勾选「...

【绕过APP抓包限制】Xposed+JustTrustMe关闭SSL证书验证!

【绕过APP抓包限制】Xposed+JustTrustMe关闭SSL证书验证!

1 前言这篇文章主要想解决的问题是,在对安卓手机APP抓包时,出现的HTTPS报文通过MITM代理后证书不被信任的问题。(工作中在抓取12306请求时就遇到了这个问题)之前的推送讲过,通常要抓取HTT...

外网映射群晖为网络驱动器的方法

外网映射群晖为网络驱动器的方法

在外网环境下访问群晖文件通常是通过网页版DSM来完成的,相比局域网的直接访问,外网的网页访问方式多少有点不方便。这里介绍一种方法供大家参考。前提是:群晖和外网电脑都在ipv6环境下假设群晖的ipv6地...

使用git bash统计vue项目的代码量行数

需求想要统计一下自己写的vue项目的代码量。主要是src文件夹下的html、css、js、vue文件的总代码量解决方案使用git bash,切换至vue项目的src目录下,然后输入如下命令:find&...

设置端口映射从外网访问内网的共享文件(需公网ip )

开启端口映射,从外网访问内网的文件共享:    以前我的做法是远程控制软件比如teamviewer或者radmin控制内网一台电脑后再通过其访问内网,缺点是要装软件,有办法直接通过...