代码之家 › 专栏 › 技术社区 › Syed

如何禁用vue.js的<template>中段落的eslint规则max line length?

airbnb eslint vuejs2 vue.js javascript

12

Syed · 技术社区 · 6 年前

我使用的是Airbnb Eslint,目前出现错误:

错误:第6行超过了最大行长度100(最大长度) 路径/to/file.vue:6:1:

<template lang="pug">
  div
    .container
      .row
        .col-xl-10.mx-auto
          p Please let us know how you got here, and use the header buttons to navigate back to safe harbor.
</template>

有没有一种方法可以禁用上面这样的段落文本的lint?
另外,如何将线条长度从100增加到120?

4 回复 | 直到 6 年前

1

6

Yauheni Prakopchyk 6 年前

为了 eslint-plugin-vue = 4.1.0 可以使用指令注释禁用eslint。

https://github.com/vuejs/eslint-plugin-vue/commit/ad84e0ba6d81f24583e65fc70b1d9803d73d3ed9

<template>
  <!-- eslint-disable-next-line vue/max-attributes-per-line -->
  <div a="1" b="2" c="3" d="4">
  </div>
</template>

2

15

Daniel 6 年前

对于afaik,无法将eslint规则应用于模板,尤其是模板中的一行。不过,我希望被证明是错误的。

无论如何,因为我有一个包含大量文本的文件,为了绕过它,我添加了这个规则 'max-len': ["error", { "code": 120 }], 在我的 .eslintrc.js 文件。

这是结构(删除了其他设置)

module.exports {
  rules: {
    'max-len': ["error", { "code": 120 }]
  }
}

3

7

gedijedi 6 年前

这将禁用整个模板标记的规则。 Official ES Lint docs on disabling rules

<template>
  <!-- eslint-disable max-len -->
  ...

编辑:如果要禁用所有.vue文件的行长度规则,请将此添加到 .eslintrc.js (这也将禁用 <script> 和 <style> 标签):

module.exports = {
  ...
  overrides: [
    {
      files: ["*.vue"],
      rules: {
        ...
        'max-len': 'off' // disables line length check
      }
    }
  ]
};

4

1

Begueradj 6 年前

您可以将此添加到您的eslint规则中:

rules: {
  "vue/max-attributes-per-line": "off"
}

这对我很有用(即使我更愿意为我的项目设置它)。
你可以找到更多的信息 here 如果你愿意的话。