javascriptreactjsecmascript-6import

Eslint rule/plugin to merge es6 imports from same module

I would like to merge all my es6 imports from a single module to one single import in my react project.

Example: Convert this

import { Title } from "@mantine/core";
import { Center } from "@mantine/core";
import { Divider } from "@mantine/core";

to

import { Center, Divider, Title } from "@mantine/core";

Is the a eslint plugin/rule to achieve this?

Solution

  • https://eslint.org/docs/latest/rules/no-duplicate-imports

    Disallow duplicate module imports

    Using a single import statement per module will make the code clearer because you can see everything being imported from that module on one line.

    Try adding "no-duplicate-imports" to the rules section of your .eslintrc.* file