Eslint rule to put a new line inside import

问题

The rule that I'm looking should show error in this case:

import {MY_CONSTANT1, MY_CONSTANT2, MY_CONSTANT3}

And considered as fine in this case:

import {
   MY_CONSTANT1, 
   MY_CONSTANT2, 
   MY_CONSTANT3
}

Is there such eslint rule?

回答1:

I was looking for such a rule for both import and export declaration. As a result I've made a plugin with autofix.

So plugin transforms the code

import { k1, k2 } from 'something'

into

import {
  k1,
  k2
} from 'something'

and code

export { name1, name2, nameN }

into

export {
  name1,
  name2,
  nameN
}

回答2:

Edit:

Anton Antonov made a plugin that enforces this rule better than object-curly-newline can: https://stackoverflow.com/a/60477269/6179417

---

Old answer

Add the object-curly-newline rule to your .eslintrc.json, where at least ImportDeclaration is set to always (the other settings have no effect for enforcing newlines in import declarations).

Example:

"object-curly-newline": ["error", {
   "ObjectExpression": "always",
   "ObjectPattern": { "multiline": true },
   "ImportDeclaration": "always",
   "ExportDeclaration": { "multiline": true, "minProperties": 3 }
}]

This pattern will now result in an error:

While this is valid:

However, there is a catch - this rule only requires newlines after the opening brace and before the closing brace, so you can still double up on imports as long as they have newlines in between the braces:

回答3:

I was looking for the solution and unfortunately have only found your question. I have decided to learn a bit about how eslint works and how to write your own plugins and created mine. If you know the parsed the AST node structure it is really easy to work with. Here is the plugin's main file. Autofix is more tricky though so I do not include it as it biased towards my formatting standards.

module.exports = {
  rules: {
    'single-import-per-line': {
      create (context) {
        return {
          ImportDeclaration(node) {
            if (node.specifiers.length < 2) {
              return;
            }

            let previousImport = node.specifiers[0];
            for (let i = 1; i < node.specifiers.length; i++) {
              const currentImport = node.specifiers[i];

              // Omit the first condition if you want to put default imports on a new line as well
              if (previousImport.type !== 'ImportDefaultSpecifier'
                && currentImport.loc.start.line === previousImport.loc.end.line
              ) {
                context.report({ node, message: 'Your message' });
                return;
              }

              previousImport = currentImport;
            }
          },
        };
      },
    },
  },
};

回答4:

you can try this

"semicolon": [true, "always"]

来源：https://stackoverflow.com/questions/58656094/eslint-rule-to-put-a-new-line-inside-import