TypeScript Rules
TypeScript enum, interface, type formatting, and definition organization
8 rules6 auto-isFixable4 isConfigurable8 TypeScript-only
On This Page
enum-format
auto-isFixableTypeScript only
Enforce enum naming (PascalCase + Enum suffix), UPPER_CASE members, trailing commas
Why: Consistent enum naming makes enums instantly recognizable
Correct
javascript
export enum StatusEnum { ACTIVE = "active", INACTIVE = "inactive", PENDING = "pending",}Incorrect
javascript
export enum Status { active = "active", inactive = "inactive";}eslint.config.js
javascript
"code-style/enum-format": "error"enum-type-enforcement
auto-isFixableTypeScript only
Use enum values instead of string literals for variables typed with *Type
Why: Enum values provide type safety, autocompletion, and prevent typos
Correct
javascript
const variant = ButtonVariantEnum.PRIMARY;Incorrect
javascript
const variant = "primary"; // typed as ButtonVariantTypeeslint.config.js
javascript
"code-style/enum-type-enforcement": "error"interface-format
auto-isFixableTypeScript only
Enforce interface naming (PascalCase + Interface suffix), camelCase properties, commas
Why: Consistent interface naming makes interfaces instantly recognizable
Correct
javascript
export interface UserInterface { email: string, id: string, name: string,}Incorrect
javascript
export interface User { Email: string; ID: string;}eslint.config.js
javascript
"code-style/interface-format": "error"no-inline-type-definitions
isConfigurableTypeScript onlyreport only
Inline union types in function params should be extracted to named types
Why: Complex inline types make function signatures hard to read
Options
| Option | Type | Default | Description |
|---|---|---|---|
maxUnionMembers | integer | 2 | Max union members before requiring extraction |
maxLength | integer | 50 | Max character length before requiring extraction |
eslint.config.js
javascript
"code-style/no-inline-type-definitions": ["error", { maxUnionMembers: 2, maxLength: 50 }]Correct
javascript
// types.tsexport type ButtonVariantType = "primary" | "muted" | "danger"; // Button.tsximport { ButtonVariantType } from "./types";Incorrect
javascript
const Button = ({ variant }: { variant?: "primary" | "muted" | "danger" }) => {};eslint.config.js
javascript
"code-style/no-inline-type-definitions": "error"prop-naming-convention
auto-isFixableisConfigurableTypeScript only
Boolean props start with is/has/with/without, callbacks start with on
Why: Consistent prop naming makes props self-documenting
Options
| Option | Type | Default | Description |
|---|---|---|---|
extendBooleanPrefixes | string[] | [] | Add to default boolean prefixes |
callbackPrefix | string | "on" | Required prefix for callback props |
eslint.config.js
javascript
"code-style/prop-naming-convention": ["error", { extendBooleanPrefixes: [], callbackPrefix: "on" }]Correct
javascript
interface ButtonPropsInterface { isDisabled: boolean, isLoading: boolean, onClick: () => void,}Incorrect
javascript
interface ButtonPropsInterface { disabled: boolean, loading: boolean, click: () => void,}eslint.config.js
javascript
"code-style/prop-naming-convention": "error"type-annotation-spacing
auto-isFixableTypeScript only
No space before colon, one space after colon, no space before generics
Why: Consistent type annotation spacing follows TypeScript conventions
Correct
javascript
const name: string = "John";const items: string[] = [];const data: Array<number> = [];Incorrect
javascript
const name : string = "John";const items:string [] = [];eslint.config.js
javascript
"code-style/type-annotation-spacing": "error"type-format
auto-isFixableisConfigurableTypeScript only
Enforce type naming (PascalCase + Type suffix), properties, union formatting
Why: Consistent type naming makes types instantly recognizable
Options
| Option | Type | Default | Description |
|---|---|---|---|
minUnionMembersForMultiline | integer | 5 | Minimum union members for multiline format |
eslint.config.js
javascript
"code-style/type-format": ["error", { minUnionMembersForMultiline: 5 }]Correct
javascript
export type UserType = { email: string, id: string, name: string,}; export type ButtonVariantType = "danger" | "ghost" | "link" | "muted" | "primary";Incorrect
javascript
export type User = { Email: string; ID: string;};eslint.config.js
javascript
"code-style/type-format": "error"typescript-definition-location
isConfigurableTypeScript onlyreport only
Enforce TypeScript definitions to be in designated folders (interfaces/, types/, enums/)
Why: Separating definitions by category makes them easier to find and maintain
Correct
javascript
// src/interfaces/user.tsexport interface UserInterface { ... } // src/types/config.tsexport type ConfigType = { ... }Incorrect
javascript
// src/components/user-card.tsxinterface UserProps { ... } // Should be in interfaces/eslint.config.js
javascript
"code-style/typescript-definition-location": "error"