no-inline-comments

A comment next to code makes the line longer, and it's easy to miss when you scan down the left edge of a file. With this rule, every comment goes on its own line.

Comments that configure the linter, such as // eslint-disable-line, aren't reported.

Configure

Off by default. To turn it on:

[lint.rules]
"no-inline-comments" = "error" # or "warn"

Every option, set to its default. The ones that are commented out are unset by default.

[lint.rules]
"no-inline-comments" = ["error", {
  # ignorePattern = <string>,
}]

Examples

Reported:

const retries = 3; // the network is flaky
const timeout = /* seconds */ 30;
/* legacy */ connect(retries, timeout);

Not reported:

// The network is flaky.
const retries = 3;

/* In seconds. */
const timeout = 30;

connect(retries, timeout); // eslint-disable-line no-undef

In JSX, a comment in braces is fine if nothing else shares a line with the braces:

const page = (
  <main>
    {/* The header comes from the layout. */}
    <Article />
  </main>
);

const page = (
  <main>
    <Article /> {/* The header comes from the layout. */}
  </main>
);

Options

const locale = import(/* webpackChunkName: "locale-en" */ "./locale/en.js");

const locale = import(/* the default */ "./locale/en.js");