Implement @ngrx/eslint-plugin for NgRx Signals and Component Store linting
Nobody has claimed this yet.
- Dominant language
- Java
- Stars
- 970
- Forks
- 486
- Avg merge
- 3d 33m
- Merged PRs (30d)
- 170
Description
Description
Add and configure @ngrx/eslint-plugin in the core-web Nx monorepo to enforce NgRx best practices for the packages currently in use.
The monorepo already uses NgRx Signals, Component Store, and Operators (@ngrx/signals, @ngrx/component-store, @ngrx/operators at 21.1.1) across multiple stores and features (e.g. edit-content, edit-ema, global-store, image-editor, portlets). ESLint is configured with flat config (eslint.config.mjs) at the workspace root and per project, but there is no NgRx-specific lint coverage today.
Implementation should follow the official NgRx ESLint plugin installation guide: https://ngrx.io/guide/eslint-plugin/install
Scope
| In scope | Out of scope |
|---|---|
Install @ngrx/eslint-plugin (version aligned with existing @ngrx/* packages) |
@ngrx/store / @ngrx/effects rules (not used in this repo) |
Configure flat ESLint via ng add @ngrx/eslint-plugin |
Unrelated ESLint rule changes |
Enable rules for signals, component-store, and operators only |
New NgRx features or store refactors beyond lint fixes |
| Fix all existing violations introduced by the new rules |
Implementation notes
- Prefer
ng add @ngrx/eslint-plugin— the schematic supports ESLint 9 flat config (eslint.config.mjs). - Peer dependency
typescript-eslintis already present in the workspace. - Apply NgRx rules to TypeScript files that use NgRx patterns (stores, features, component-store), not unrelated SDK or utility libraries.
Acceptance Criteria
-
@ngrx/eslint-pluginis added as a devDependency at a version compatible with the existing@ngrx/*packages (21.1.1) -
core-web/eslint.config.mjsis updated viang add @ngrx/eslint-pluginwith NgRx rule configs forsignals,component-store, andoperatorsonly (notstoreoreffects) - NgRx ESLint rules apply to TypeScript files that use NgRx (stores, signal stores, component stores, features) without breaking lint for unrelated projects
-
pnpm run lint:dotcmscompletes with zero NgRx ESLint violations across the workspace - All pre-existing NgRx rule violations in affected files are fixed in the same change (no blanket rule downgrades to
warn/offunless individually justified in code review) - CI lint checks for
core-webpass after the change
Additional Context
- Reference: https://ngrx.io/guide/eslint-plugin/install
- Current ESLint setup: Flat config at
core-web/eslint.config.mjswith@nx/eslint-plugin, TypeScript, import, and stylistic rules - NgRx usage: Widespread
@ngrx/signals(signalStore, features) and@ngrx/component-storeacross portlets and shared libs; seecore-web/CLAUDE.md("Use NgRx signals for state management") - Version alignment: Keep
@ngrx/eslint-pluginon the same major/minor line as@ngrx/signals/@ngrx/component-store/@ngrx/operators
Contributor guide
First steps
- Read the whole issue, then the project's contributing guide.
- Comment on the issue to say you are picking it up — it saves two people doing the same work.
- Fork the repository and make your change on a branch.
- Open a pull request that references the issue number.
Research direction
Start with core-web/eslint.config.mjs, the existing flat ESLint configuration, and the official @ngrx/eslint-plugin installation guide. Run ng add @ngrx/eslint-plugin, then run pnpm run lint:dotcms and inspect NgRx-using stores, features, and component-store files for violations. Done means the signals, component-store, and operators rules are configured, violations are fixed, and core-web CI lint passes without affecting unrelated projects.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- typescript
- Domain
- tooling
- Issue type
- Feature
- Difficulty
- 4/5
- Estimated time
- 3-5 days
- Activity status
- Quiet
- Clarity
- Mostly clear
- Newbie friendliness
- 48/100