Recently, I wrote about using eslint-plugin-boundaries to enforce Feature-Sliced Design architecture in a React project.

The idea is simple: instead of relying on developers to remember which layers can import from which, let ESLint check it automatically.

But if you look into FSD tooling, I will get coming across another option: Steiger .

It's specifically designed for checking Feature-Sliced Design. So naturally, you might wonder:

Am I using the wrong tool? Should I replace eslint-plugin-boundaries with Steiger?

After comparing them, I don't think the answer is that simple.

What do they have in common?

Both tools can help prevent architectural violations.

For example, in FSD, a feature can depend on an entity, but an entity shouldn't depend on a feature.

// ✅ Allowed // Features/Profile/ui/Profile.tsx

import { UserAvatar } from " @/Entities/User " ;

Enter fullscreen mode

Exit fullscreen mode

// ❌ Forbidden // Entities/User/ui/UserCard.tsx

import { EditProfile } from " @/Features/EditProfile "…