ESLint Stylistic

Appearance

@stylistic/js/

max-len ​

Very long lines of code in any language can be difficult to read. In order to aid in readability and maintainability many coders have developed a convention to limit lines of code to X number of characters (traditionally 80 characters).

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

Rule Details ​

This rule enforces a maximum line length to increase code readability and maintainability. The length of a line is defined as the number of Unicode characters in the line.

Options ​

This rule can have up to two numbers as positional arguments (for code and tabWidth options), followed by an object option (provided positional arguments have priority):

  • "code" (default 80) enforces a maximum line length
  • "tabWidth" (default 4) specifies the character width for tab characters
  • "comments" enforces a maximum line length for comments; defaults to value of code
  • "ignorePattern" ignores lines matching a regular expression; can only match a single line and need to be double escaped when written in YAML or JSON
  • "ignoreComments": true ignores all trailing comments and comments on their own line
  • "ignoreTrailingComments": true ignores only trailing comments
  • "ignoreUrls": true ignores lines that contain a URL
  • "ignoreStrings": true ignores lines that contain a double-quoted or single-quoted string
  • "ignoreTemplateLiterals": true ignores lines that contain a template literal
  • "ignoreRegExpLiterals": true ignores lines that contain a RegExp literal

code ​

Examples of incorrect code for this rule with the default { "code": 80 } option:

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" };
/*eslint @stylistic/js/max-len: ["error", { "code": 80 }]*/

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

Examples of correct code for this rule with the default { "code": 80 } option:

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"
};
/*eslint @stylistic/js/max-len: ["error", { "code": 80 }]*/

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

tabWidth ​

Examples of incorrect code for this rule with the default { "tabWidth": 4 } option:

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" } };
/*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" } };
incorrect

Examples of correct code for this rule with the default { "tabWidth": 4 } option:

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  };
/*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  };
correct

comments ​

Examples of incorrect code for this rule with the { "comments": 65 } option:

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

/**
 * This is a comment that violates the maximum line length we have specified
**/
/*eslint @stylistic/js/max-len: ["error", { "comments": 65 }]*/

/**
 * This is a comment that violates the maximum line length we have specified
**/
incorrect

ignoreComments ​

Examples of correct code for this rule with the { "ignoreComments": true } option:

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

/**
 * This is a really really really really really really really really really long comment
**/
/*eslint @stylistic/js/max-len: ["error", { "ignoreComments": true }]*/

/**
 * This is a really really really really really really really really really long comment
**/
correct

ignoreTrailingComments ​

Examples of correct code for this rule with the { "ignoreTrailingComments": true } option:

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

var foo = 'bar'; // This is a really really really really really really really long comment
/*eslint @stylistic/js/max-len: ["error", { "ignoreTrailingComments": true }]*/

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

ignoreUrls ​

Examples of correct code for this rule with the { "ignoreUrls": true } option:

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

var url = 'https://www.example.com/really/really/really/really/really/really/really/long';
/*eslint @stylistic/js/max-len: ["error", { "ignoreUrls": true }]*/

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

ignoreStrings ​

Examples of correct code for this rule with the { "ignoreStrings": true } option:

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

var longString = 'this is a really really really really really long string!';
/*eslint @stylistic/js/max-len: ["error", { "ignoreStrings": true }]*/

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

ignoreTemplateLiterals ​

Examples of correct code for this rule with the { "ignoreTemplateLiterals": true } option:

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

var longTemplateLiteral = `this is a really really really really really long template literal!`;
/*eslint @stylistic/js/max-len: ["error", { "ignoreTemplateLiterals": true }]*/

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

ignoreRegExpLiterals ​

Examples of correct code for this rule with the { "ignoreRegExpLiterals": true } option:

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

var longRegExpLiteral = /this is a really really really really really long regular expression!/;
/*eslint @stylistic/js/max-len: ["error", { "ignoreRegExpLiterals": true }]*/

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

ignorePattern ​

Examples of correct code for this rule with the ignorePattern option:

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');
/*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');
correct

Released under the MIT License.

Copyright OpenJS Foundation and other contributors, www.openjsf.org.
Copyright © 2023-PRESENT ESLint Stylistic contributors.