跳至内容

@stylistic/js/

max-len

任何语言中过长的代码行都很难阅读。为了提高可读性和可维护性,许多程序员已经制定了将代码行限制为 X 个字符(传统上为 80 个字符)的约定。

js
var foo = { "bar": "This is a bar.", "baz": { "qux": "This is a qux" }, "difficult": "to read" }; // very long

规则详情

此规则强制执行最大行长度,以提高代码的可读性和可维护性。行长度定义为行中 Unicode 字符的数量。

选项

此规则最多可以接受两个数字作为位置参数(用于 codetabWidth 选项),然后是一个对象选项(前提是位置参数具有优先级)

  • "code"(默认值为 80)强制执行最大行长度
  • "tabWidth"(默认值为 4)指定制表符的字符宽度
  • "comments" 强制执行注释的最大行长度;默认为 code 的值
  • "ignorePattern" 忽略与正则表达式匹配的行;只能匹配单行,并且在 YAML 或 JSON 中写入时需要双重转义
  • "ignoreComments": true 忽略所有尾部注释和独立行的注释
  • "ignoreTrailingComments": true 仅忽略尾部注释
  • "ignoreUrls": true 忽略包含 URL 的行
  • "ignoreStrings": true 忽略包含双引号或单引号字符串的行
  • "ignoreTemplateLiterals": true 忽略包含模板字面量的行
  • "ignoreRegExpLiterals": true 忽略包含 RegExp 字面量的行

code

使用默认 { "code": 80 } 选项时,此规则的不正确代码示例

js
/*eslint @stylistic/js/max-len: ["error", { "code": 80 }]*/

var foo = { "bar": "This is a bar.", "baz": { "qux": "This is a qux" }, "difficult": "to read" };
不正确

使用默认 { "code": 80 } 选项时,此规则的正确代码示例

js
/*eslint @stylistic/js/max-len: ["error", { "code": 80 }]*/

var foo = {
  "bar": "This is a bar.",
  "baz": { "qux": "This is a qux" },
  "easier": "to read"
};
正确

tabWidth

使用默认 { "tabWidth": 4 } 选项时,此规则的不正确代码示例

js
/*eslint @stylistic/js/max-len: ["error", { "code": 80, "tabWidth": 4 }]*/
\t \t var foo = { "bar": "This is a bar.", "baz": { "qux": "This is a qux" } };
不正确

使用默认 { "tabWidth": 4 } 选项时,此规则的正确代码示例

js
/*eslint @stylistic/js/max-len: ["error", { "code": 80, "tabWidth": 4 }]*/
\t \t var foo = { \t \t \t \t "bar": "This is a bar.", \t \t \t \t "baz": { "qux": "This is a qux" } \t \t };
正确

comments

使用 { "comments": 65 } 选项时,此规则的不正确代码示例

js
/*eslint @stylistic/js/max-len: ["error", { "comments": 65 }]*/

/**
* This is a comment that violates the maximum line length we have specified
**/
不正确

ignoreComments

使用 { "ignoreComments": true } 选项时,此规则的正确代码示例

js
/*eslint @stylistic/js/max-len: ["error", { "ignoreComments": true }]*/

/**
 * This is a really really really really really really really really really long comment
**/
正确

ignoreTrailingComments

使用 { "ignoreTrailingComments": true } 选项时,此规则的正确代码示例

js
/*eslint @stylistic/js/max-len: ["error", { "ignoreTrailingComments": true }]*/

var foo = 'bar'; // This is a really really really really really really really long comment
正确

ignoreUrls

使用 { "ignoreUrls": true } 选项时,此规则的正确代码示例

js
/*eslint @stylistic/js/max-len: ["error", { "ignoreUrls": true }]*/

var url = 'https://www.example.com/really/really/really/really/really/really/really/long';
正确

ignoreStrings

使用 { "ignoreStrings": true } 选项时,此规则的正确代码示例

js
/*eslint @stylistic/js/max-len: ["error", { "ignoreStrings": true }]*/

var longString = 'this is a really really really really really long string!';
正确

ignoreTemplateLiterals

使用 { "ignoreTemplateLiterals": true } 选项时,此规则的正确代码示例

js
/*eslint @stylistic/js/max-len: ["error", { "ignoreTemplateLiterals": true }]*/

var longTemplateLiteral = `this is a really really really really really long template literal!`;
正确

ignoreRegExpLiterals

使用 { "ignoreRegExpLiterals": true } 选项时,此规则的正确代码示例

js
/*eslint @stylistic/js/max-len: ["error", { "ignoreRegExpLiterals": true }]*/

var longRegExpLiteral = /this is a really really really really really long regular expression!/;
正确

ignorePattern

使用 ignorePattern 选项时,此规则的正确代码示例

js
/*eslint @stylistic/js/max-len: ["error", { "ignorePattern": "^\\s*var\\s.+=\\s*require\\s*\\(" }]*/
var dep = require('really/really/really/really/really/really/really/really/long/module');
正确