eslint-plugin-simple-import-sort

What is eslint-plugin-simple-import-sort?

The eslint-plugin-simple-import-sort package is an ESLint plugin that automatically sorts import statements in your JavaScript and TypeScript files. It helps in maintaining a consistent order of imports, making the codebase easier to read and maintain. It can sort imports alphabetically, group and separate different types of imports, and remove duplicate imports.

What are eslint-plugin-simple-import-sort's main functionalities?

Sorting import statements

This feature automatically sorts import statements alphabetically and groups them. After running ESLint with this plugin, the imports would be sorted as follows: import React from 'react'; import z from 'zoo'; import { a, b } from 'alphabet'; import { c as cat, d as dog } from 'animals';

import React from 'react';
import { b, a } from 'alphabet';
import z from 'zoo';
import { d as dog, c as cat } from 'animals';

Grouping and separating imports

This feature groups and separates imports by their origin. Built-in modules, external modules, internal modules, and local modules are grouped together and separated by a blank line. After sorting, the imports would be grouped as follows: import fs from 'fs'; import path from 'path'; import React from 'react'; import myLocalModule from './myLocalModule';

import fs from 'fs';
import path from 'path';
import myLocalModule from './myLocalModule';
import React from 'react';

Removing duplicate imports

This feature detects and removes duplicate import statements. After running ESLint with this plugin, only one import statement will remain: import { a } from 'module';

import { a } from 'module';
import { a } from 'module';

Other packages similar to eslint-plugin-simple-import-sort

eslint-plugin-import

This package provides a set of rules that help enforce a convention in the order of require/import statements. It is more configurable than eslint-plugin-simple-import-sort and includes a variety of other rules to ensure proper imports, prevent misspellings, and manage dependencies.

import-sort

This is not an ESLint plugin but a standalone tool that sorts imports using various style configurations. It can be used in conjunction with ESLint but requires separate configuration and execution.

eslint-plugin-autofix

This package extends ESLint's autofixing capabilities and can be used to sort imports among other things. However, it is not solely focused on import sorting and requires additional configuration to achieve similar functionality to eslint-plugin-simple-import-sort.

README

eslint-plugin-simple-import-sort

Easy autofixable import sorting.

• ✅️ Runs via eslint --fix – no new tooling
• ✅️ Also sorts exports where possible
• ✅️ Handles comments
• ✅️ Handles type imports/exports
• ✅️ TypeScript friendly (via @typescript-eslint/parser)
• ✅️ Prettier friendly
• ✅️ dprint friendly (with configuration)
• ✅️ eslint-plugin-import friendly
• ✅️ git diff friendly
• ✅️ 100% code coverage
• ✅️ No dependencies
• ❌ Does not support require

This is for those who use eslint --fix (autofix) a lot and want to completely forget about sorting imports!

Example

➡️ Full readme

Changelog

Version 12.0.0 (2024-02-10)

This release removes the support for import assignments added in version 11.0.0:

• Turns out it was broken in some cases.
• The suggested fix went past my complexity tolerance for such an esoteric feature.
• I also learned that they aren’t really imports, and that I don’t understand their semantics well enough to know how sorting them affects your program.

If you miss the support for import assignments, I suggest you write your own ESLint rule which moves them out of the way from the actual imports, sorting them or not.