DEV Community

bespy
bespy

Posted on

How to alphabetize your import statements in React files and package.json

Add the following to package.json and run bun install:

"eslint-config-next": "15.3.2", "eslint-plugin-package-json": "^0.29.1", "eslint-plugin-simple-import-sort": "^12.1.1", 
Enter fullscreen mode Exit fullscreen mode
// eslint.config.mjs import { FlatCompat } from '@eslint/eslintrc'; import packageJson from "eslint-plugin-package-json"; import simpleImportSort from 'eslint-plugin-simple-import-sort'; import { dirname } from 'path'; import { fileURLToPath } from 'url'; const __filename = fileURLToPath(import.meta.url); const __dirname = dirname(__filename); const compat = new FlatCompat({ baseDirectory: __dirname, }); const eslintConfig = [ ...compat.extends('next/core-web-vitals', 'next/typescript'), { plugins: { 'simple-import-sort': simpleImportSort, }, rules: { 'simple-import-sort/imports': 'error', 'simple-import-sort/exports': 'error', }, }, packageJson.configs.recommended, ]; export default eslintConfig; 
Enter fullscreen mode Exit fullscreen mode

Image description

Image description

Top comments (0)