Eslint rule to put a new line inside import

旧城冷巷雨未停 提交于 2021-02-04 14:51:13

问题


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

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!