Rules that enforce consistent formatting and style for Flow type annotations, including spacing, delimiters, and code organization.
Controls spacing around type annotations, colons, and generic brackets.
const rules = {
'space-before-type-colon': ESLintRule,
'space-after-type-colon': ESLintRule,
'space-before-generic-bracket': ESLintRule,
'generic-spacing': ESLintRule,
'union-intersection-spacing': ESLintRule
};
// Configuration options
type SpacingOption = 'always' | 'never';Usage Examples:
// space-before-type-colon with 'never' option
// ✓ Good
function getName(user: User): string {}
// ✗ Bad
function getName(user : User): string {}
// space-after-type-colon with 'always' option
// ✓ Good
function getName(user: User): string {}
// ✗ Bad
function getName(user:User): string {}
// space-before-generic-bracket with 'never' option
// ✓ Good
type List<T> = Array<T>;
// ✗ Bad
type List <T> = Array<T>;
// union-intersection-spacing with 'always' option
// ✓ Good
type StringOrNumber = string | number;
type Combined = TypeA & TypeB;
// ✗ Bad
type StringOrNumber = string|number;
type Combined = TypeA&TypeB;Controls formatting within object type definitions including spacing and delimiters.
const rules = {
'object-type-curly-spacing': ESLintRule,
'object-type-delimiter': ESLintRule,
'delimiter-dangle': ESLintRule
};
// Configuration options
interface ObjectSpacingOptions {
arraysInObjects?: boolean;
objectsInObjects?: boolean;
}
type DelimiterOption = 'comma' | 'semicolon' | 'none';
type DangleOption = 'always' | 'always-multiline' | 'never';Usage Examples:
// object-type-curly-spacing with 'never' option
// ✓ Good
type User = {name: string, age: number};
// ✗ Bad
type User = { name: string, age: number };
// object-type-delimiter with 'comma' option
// ✓ Good
type User = {
name: string,
age: number,
};
// ✗ Bad
type User = {
name: string;
age: number;
};
// delimiter-dangle with 'always-multiline' option
// ✓ Good - multiline requires trailing comma
type User = {
name: string,
age: number,
};
// ✓ Good - single line no trailing comma
type Point = {x: number, y: number};Controls the style of boolean and primitive type annotations.
const rules = {
'boolean-style': ESLintRule,
'quotes': ESLintRule
};
// Configuration options
type BooleanStyleOption = 'boolean' | 'bool';
type QuoteOption = 'single' | 'double';Usage Examples:
// boolean-style with 'boolean' option
// ✓ Good
type IsActive = boolean;
// ✗ Bad
type IsActive = bool;
// quotes with 'single' option
// ✓ Good
type Status = 'active' | 'inactive';
// ✗ Bad
type Status = "active" | "inactive";Controls semicolon usage in type definitions and related punctuation.
const rules = {
semi: ESLintRule
};
// Configuration options
type SemiOption = 'always' | 'never';Usage Examples:
// semi with 'always' option
// ✓ Good
type User = {name: string};
declare var user: User;
// ✗ Bad
type User = {name: string}
declare var user: UserControls parentheses around arrow function parameters when they have type annotations.
const rules = {
'arrow-parens': ESLintRule
};
// Configuration options
type ArrowParensOption = 'always' | 'as-needed';Usage Examples:
// arrow-parens with 'always' option
// ✓ Good
const process = (user: User) => user.name;
const getId = (id: number) => id;
// ✗ Bad
const process = user: User => user.name;
const getId = id: number => id;
// arrow-parens with 'as-needed' option
// ✓ Good - parentheses needed for type annotation
const process = (user: User) => user.name;
// ✓ Good - no parentheses needed for simple parameter
const simple = x => x * 2;Controls line breaks and organization of type annotations.
const rules = {
'enforce-line-break': ESLintRule,
'newline-after-flow-annotation': ESLintRule
};Usage Examples:
// enforce-line-break
// ✓ Good - line break enforced for long type annotations
type ComplexFunction = (
param1: string,
param2: number,
param3: boolean
) => string;
// ✗ Bad - should break long type annotation
type ComplexFunction = (param1: string, param2: number, param3: boolean) => string;
// newline-after-flow-annotation
// ✓ Good
// @flow
import type {User} from './types';
// ✗ Bad - no newline after @flow
// @flow
import type {User} from './types';Controls the style of Flow type imports.
const rules = {
'type-import-style': ESLintRule
};
// Configuration options
type ImportStyleOption = 'declaration' | 'identifier';Usage Examples:
// type-import-style with 'declaration' option
// ✓ Good
import type {User, Product} from './types';
// ✗ Bad
import {type User, type Product} from './types';
// type-import-style with 'identifier' option
// ✓ Good
import {type User, type Product} from './types';
// ✗ Bad
import type {User, Product} from './types';Controls sorting of keys and type members for consistent organization.
const rules = {
'sort-keys': ESLintRule,
'sort-type-union-intersection-members': ESLintRule
};
// Configuration options
interface SortKeysOptions {
caseSensitive?: boolean;
natural?: boolean;
requiredFirst?: boolean;
}Usage Examples:
// sort-keys with natural sorting
// ✓ Good
type User = {
age: number,
id: number,
name: string,
};
// ✗ Bad - keys not sorted
type User = {
name: string,
id: number,
age: number,
};
// sort-type-union-intersection-members
// ✓ Good - alphabetical order
type StringOrNumber = number | string;
// ✗ Bad - not sorted
type StringOrNumber = string | number;interface SpacingRule extends ESLintRule {
create: (context: ESLintContext) => {
[key: string]: (node: ASTNode) => void;
};
}
interface FormattingOptions {
spacing?: SpacingOption;
delimiter?: DelimiterOption;
quotes?: QuoteOption;
semicolon?: SemiOption;
}
interface ASTNode {
type: string;
range: [number, number];
loc: SourceLocation;
parent?: ASTNode;
raw?: string;
}