← Projects

eslint-plugin-mvvm

An ESLint plugin that enforces MVVM architectural layer boundaries in React codebases, keeping data flowing one way from Model to ViewModel to View.

Preview

Built with

TypeScript · ESLint · React · Bun

Overview

eslint-plugin-mvvm turns MVVM conventions into lint rules. API calls and business state in View files become ESLint errors and get pushed into ViewModel hooks where they belong, while import direction is checked so Views never reach past their ViewModels into the Model layer. File classification follows common React conventions out of the box and is fully overridable through shared settings.

Highlights

  • no-api-in-view: flags fetch, axios, TanStack Query, RTK Query, SWR, and Apollo hooks in View files
  • no-state-in-view: strict mode bans all state, warn-business mode allows pure UI state
  • no-jsx-in-viewmodel: ViewModels return data, not JSX
  • enforce-layer-boundaries: import direction checks with real on-disk module resolution
  • recommended and strict shareable configs for incremental or zero-tolerance adoption
  • Overridable View, ViewModel, and Model patterns via shared settings
  • Flat config ready for ESLint 9, MIT licensed, published with npm provenance