eslint-plugin-feature-sliced-path-checker-stable

ESLint plugin for checking import paths according to Feature-Sliced Design.

Installation

You'll first need to install ESLint:

npm i eslint --save-dev

Next, install eslint-plugin-feature-sliced-path-checker-stable:

npm install eslint-plugin-feature-sliced-path-checker-stable --save-dev

Usage

Flat config (eslint.config.js, ESLint 9+)

import fsd from 'eslint-plugin-feature-sliced-path-checker-stable';

export default [
    {
        plugins: {
            'feature-sliced-path-checker-stable': fsd,
        },
        rules: {
            'feature-sliced-path-checker-stable/path-checker': [
                'error',
                { alias: '@' },
            ],
            'feature-sliced-path-checker-stable/public-api-imports': [
                'error',
                {
                    alias: '@',
                    testFilesPatterns: [
                        '**/*.test.*',
                        '**/*.stories.*',
                        '**/StoreDecorator.tsx',
                    ],
                },
            ],
            'feature-sliced-path-checker-stable/layer-imports': [
                'error',
                {
                    alias: '@',
                    ignoreImportPatterns: ['**/StoreProvider'],
                },
            ],
        },
    },
];

Legacy config (.eslintrc)

module.exports = {
    plugins: ['feature-sliced-path-checker-stable'],
    rules: {
        'feature-sliced-path-checker-stable/path-checker': [
            'error',
            { alias: '@' },
        ],
        'feature-sliced-path-checker-stable/public-api-imports': [
            'error',
            {
                alias: '@',
                testFilesPatterns: [
                    '**/*.test.*',
                    '**/*.stories.*',
                    '**/StoreDecorator.tsx',
                ],
            },
        ],
        'feature-sliced-path-checker-stable/layer-imports': [
            'error',
            {
                alias: '@',
                ignoreImportPatterns: ['**/StoreProvider'],
            },
        ],
    },
};

Rules

path-checker

Enforce relative import paths between modules within the same slice.

If a module imports from another module that lives in the same layer and same slice, the import must be relative rather than absolute.

// ❌ inside src/entities/Article — absolute import within the same slice
import { articleReducer } from '@/entities/Article/model/slice/articleSlice';

// ✅ relative import within the same slice
import { articleReducer } from '../../model/slice/articleSlice';

Options

| Option | Type | Default | Description | | ------- | -------- | ------- | ---------------------------------------------------- | | alias | string | "" | Alias prefix used for absolute imports (e.g. "@"). |

public-api-imports

Allow imports from other slices only through their Public API.

Modules from another slice may only be imported from that slice's Public API (index.ts). Deep imports into a slice's internals are reported. Test-only data must be imported from the slice's testing Public API (testing.ts), and only inside files matching testFilesPatterns.

// ❌ deep import — bypasses the Public API
import { Article } from '@/entities/Article/model/types/article';

// ✅ import from the Public API
import { Article } from '@/entities/Article';

// ✅ testing Public API — allowed only in test files
import { getArticleData } from '@/entities/Article/testing';

Options

| Option | Type | Default | Description | | ------------------- | ---------- | ------- | -------------------------------------------------------------------------------------- | | alias | string | "" | Alias prefix used for absolute imports (e.g. "@"). | | testFilesPatterns | string[] | [] | Glob patterns for test files where importing from the testing Public API is allowed. |

layer-imports

Enforce the Feature-Sliced Design layer hierarchy.

A module may only import from layers below its own. The hierarchy, from top to bottom, is: app > pages > widgets > features > entities > shared. Importing from the same or a higher layer is reported (entities may import from entities, and shared may only import from shared).

// ❌ inside src/entities/Article — importing from a higher layer (features)
import { LoginForm } from '@/features/AuthByUsername';

// ✅ inside src/features/AuthByUsername — importing from a lower layer (entities)
import { Article } from '@/entities/Article';

// ✅ any layer may import from shared
import { Button } from '@/shared/ui/Button';

Options

| Option | Type | Default | Description | | ---------------------- | ---------- | ------- | -------------------------------------------------------------------- | | alias | string | "" | Alias prefix used for absolute imports (e.g. "@"). | | ignoreImportPatterns | string[] | [] | Glob patterns for file paths that should be excluded from this rule. |

License

MIT