Rules Hub
Code Ruleset
← Back to all rules
Rule priority, scope & exceptions
Use this to align rules with the senior-level structure (P0/P1/P2, scope, exceptions/tradeoffs).
frontend ruleP2stack specificStack: css
cssimportsstructureanti-pattern
Don't import styles in index files
Keep component-local styles with their owner; avoid accidental style side effects in pure re-export barrels, while preserving legitimate entry-point imports.
PR: hegnar-forum-web · org-mining-hist-2026-06Created: Jun 20, 2026
Bad example
Old codetsx
| 1 | // pages/feature/index.tsx |
| 2 | import styles from './styles.module.scss'; |
Explanation (EN)
A style side effect hidden in a pure barrel can load unrelated CSS and obscure ownership.
Objašnjenje (HR)
Good example
New codetsx
| 1 | // import the stylesheet inside the component that uses it |
| 2 | // Component.tsx |
| 3 | import styles from './Component.module.scss'; |
Explanation (EN)
Objašnjenje (HR)
Notes (EN)
For a pure re-export barrel, keep component-local style dependencies with the component that consumes them unless the package intentionally exposes a style side effect.
Exceptions / Tradeoffs (EN)
A page/component implemented in index.tsx may correctly import its own styles. Framework global-style entry files and package CSS exports are legitimate exceptions.