✨ Auto-fixable import sorting rules for ESLint

The pretty much standard way of sorting imports in JavaScript:

• 3rd party imports first
• then local default exports
• and then local exports

And here's the snippet that sorts them in this exact order and satisfies my needs completely!

$ npm i --save-dev eslint-plugin-import

# or 

$ yarn add -D eslint-plugin-import



// .eslintrc.js 

const fs = require('fs')

const ignoredSortingDirectories = ['.git', '.next', '.vscode', 'node\_modules']

module.exports = {

/// ... some other configurations 

 rules: {

// ... your rules 

'sort-imports': ['error', { ignoreCase: true, ignoreDeclarationSort: true }],

'import/order': [

1,

{

 groups: ['external', 'builtin', 'internal', 'sibling', 'parent', 'index'],

 pathGroups: [

...getDirectoriesToSort().map((singleDir) => ({ pattern: `${singleDir}/\*\*`, group: 'internal' })),

{ pattern: 'env', group: 'internal' },

{ pattern: 'theme', group: 'internal' },

{ pattern: 'public/\*\*', group: 'internal', position: 'after' },

],

 pathGroupsExcludedImportTypes: ['internal'],

 alphabetize: {

 order: 'asc',

 caseInsensitive: true,

},

},

],

// ... your rules 

},

}

function getDirectoriesToSort() {

return getDirectories(process.cwd()).filter((f) => !ignoredSortingDirectories.includes(f))

}

function getDirectories(path) {

return fs.readdirSync(path).filter(function (file) {

return fs.statSync(path + '/' + file).isDirectory()

})

}