vscode代码格式化时属性不换行

最近一直使用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"  
}

 

  • 3
    点赞
  • 7
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值