相关疑难解决方法(0)

使用ESLint和Prettier在Visual Studio代码中保存时无法获得正确的autoformat

在处理.vue文件时使用ESLint和Prettier的Visual Studio代码中,我似乎无法正确地自动修复vue/max-attributes-per-line.

例如,将vue/max-attributes-per-line设置为'off',并且我尝试手动添加换行符,它会将其更正为始终使每个元素不超过一行,无论它是否为81,120 ,200或更多字符宽. 我怎样才能弄清楚什么是强制我的标记元素到一行?

我正在使用ESLint版本5.1.0和Visual Studio代码(没有Prettier扩展),Prettier 1.14.2.

这是.vue文件中的示例 - 无论我做什么,什么时候,我都无法使用多行 'vue/max-attributes-per-line': 'off'.每次我保存,它都会强制标记的长行全部在一行上.

<template>
  <font-awesome-icon v-if="statusOptions.icon" :icon="statusOptions.icon" :spin="statusOptions.isIconSpin" :class="['saving-indicator', 'pl-1', 'pt-1', statusOptions.iconClasses]" />
</template>
Run Code Online (Sandbox Code Playgroud)

如果我设置'vue/max-attributes-per-line': 2,它的格式如此,有一个换行符(这也是非常错误的).

      <font-awesome-icon v-if="statusOptions.icon" 
:icon="statusOptions.icon" :spin="statusOptions.isIconSpin" :class="['saving-indicator', 'pl-1', 'pt-1', statusOptions.iconClasses]" />
Run Code Online (Sandbox Code Playgroud)

如果我尝试手动重新格式化,那么当我保存时它只会恢复到上面的状态.

另外,当我按下Ctrl + S时,它似乎重新格式化了两次:首先它重新格式化以将其全部放在一行上,然后半秒后,上面的格式化结果. 什么想法?造成这种奇怪的原因是 - 有多个重组器正在运行吗?我怎么弄清楚第一个禁用它的是什么?

VS Code工作区设置:

{
  "editor.formatOnType": false,
  "editor.formatOnPaste": false,
  "editor.formatOnSave": true,
  "[javascript]": {
    "editor.tabSize": 2
  },
  "[vue]": {
    "editor.tabSize": 2
  },
  "[csharp]": {
    "editor.tabSize": 4
  },
  "javascript.format.insertSpaceAfterFunctionKeywordForAnonymousFunctions": true,
  "javascript.referencesCodeLens.enabled": true,
  "vetur.validation.script": false,
  "vetur.validation.template": false, …
Run Code Online (Sandbox Code Playgroud)

eslint vue.js visual-studio-code prettier

25
推荐指数
2
解决办法
9404
查看次数

标签 统计

eslint ×1

prettier ×1

visual-studio-code ×1

vue.js ×1