@putout/plugin-typescript

TypeScript is JavaScript with syntax for types.

(c) typescriptcriptlang.org

🐊Putout plugin adds ability to transform TypeScript code. Enabled by default for ts and tsx files.

Install

npm i putout @putout/plugin-typescript -D

Rules

✅ apply-as-type-assertion;
✅ apply-type-guards;
✅ apply-utility-types;
✅ convert-commonjs-to-esm;
✅ convert-empty-type-literal-to-record;
✅ convert-esm-to-commonjs;
✅ convert-generic-to-shorthand;
✅ convert-namespace-to-global;
✅ cts-file;
✅ find-file;
✅ mts-file;
✅ remove-duplicate-exports;
✅ remove-duplicate-interface-keys;
✅ remove-duplicates-from-union;
✅ remove-getter-arguments;
✅ remove-setter-return-type;
✅ remove-unused-types;
✅ remove-useless-mapped-types;
✅ remove-useless-mapping-modifiers;
✅ remove-useless-non-null-expressions;
✅ remove-useless-parens;
✅ remove-useless-promise;
✅ remove-useless-types;
✅ remove-useless-types-from-constants;
✅ rename-file-cts-to-ts;
✅ rename-file-mts-to-ts;

Config

{
    "rules": {
        "typescript/apply-as-type-assertion": "on",
        
        "typescript/apply-type-guards": "on",
        "typescript/apply-utility-types": "on",
        
        "typescript/convert-commonjs-to-esm": "off",
        
        "typescript/convert-empty-type-literal-to-record": "on",
        "typescript/convert-esm-to-commonjs": "off",
        "typescript/convert-generic-to-shorthand": "on",
        
        "typescript/convert-namespace-to-global": "on",
        
        "typescript/cts-file": "off",
        
        "typescript/find-file": ["off", {
            "ignore": []
        }],
        "typescript/mts-file": "off",
        "typescript/remove-duplicates-exports": "on",
        "typescript/remove-duplicates-from-union": "on",
        "typescript/remove-duplicates-interface-keys": "on",
        
        "typescript/remove-getter-arguments": "on",
        "typescript/remove-setter-return-type": "on",
        "typescript/remove-unused-types": "on",
        
        "typescript/remove-useless-mapped-types": "on",
        "typescript/remove-useless-non-null-expressions": "on",
        "typescript/remove-useless-parens": "on",
        "typescript/remove-useless-promise": "on",
        "typescript/remove-useless-types": "on",
        "typescript/remove-useless-types-from-constants": "on",
        
        "typescript/rename-file-cts-to-ts": "off",
        "typescript/rename-file-mts-to-ts": "off"
    }
}

apply-as-type-assertion

According to best practice.

❌ Example of incorrect code

const boundaryElement = <HTMLElement>e.target;

✅ Example of correct code

const boundaryElement1 = e.target as HTMLElement;

apply-utility-types

❌ Example of incorrect code

type SuperType1 = {
    [Key in keyof Type]?: Type[Key];
};

✅ Example of correct code

type SuperType1 = Partial<Type>;

apply-type-guards

It just so happens that TypeScript has something called a type guard. A type guard is some expression that performs a runtime check that guarantees the type in some scope.

(c) typescript.org

Check out in 🐊Putout Editor.

❌ Example of incorrect code

const isNumber = (a) => typeof a === 'number';

✅ Example of correct code

const isNumber = (a: unknown): a is number => typeof a === 'number';

convert-generic-to-shorthand

There is no difference at all. Type[] is the shorthand syntax for an array of Type. Array<Type> is the generic syntax. They are completely equivalent.

(c) https://stackoverflow.com/a/36843084/4536327

Convert generic to shorthand.

❌ Example of incorrect code

interface A {
    x: Array<X>;
    y: Array<X | Y>;
}

✅ Example of correct code

interface A {
    x: X[];
    y: X[] | Y[];
}

Comparison

Linter	Rule	Fix
🐊 Putout	`typescript/convert-generic-to-shorthand`	✅
⏣ ESLint	`@typescript-eslint/array-type`	✅

convert-commonjs-to-esm

Checkout in 🐊Putout Editor.

❌ Example of incorrect code

import foo = require('foo');
export = 5;

✅ Example of correct code

import foo from 'foo';

export default 5;

convert-esm-to-commonjs

Checkout in 🐊Putout Editor.

❌ Example of incorrect code

import foo from 'foo';

export default 5;

✅ Example of correct code

import foo = require('foo');
export = 5;

convert-namespace-to-global

Checkout in 🐊Putout Editor.

❌ Example of incorrect code

declare namespace global {
    var al: any;
}

✅ Example of correct code

declare global {
    var al: any;
}

Comparison

Linter	Rule	Fix
🐊 Putout	`typescript/convert-namespace-to-global`	✅
⏣ ESLint	`@typescript-eslint/no-namespace`	❌

convert-empty-type-literal-to-record

{} doesn't mean an empty object, but means any types other than null and undefined

(c) deno.com

Checkout in 🐊Putout Editor.

❌ Example of incorrect code

type TestFunction<T extends Test = Test> = ((message: string, fn: (t: T) => void) => void) & {
    extend<U extends CustomOperator = {}>(operators?: U): TestFunction<T & OperatorsToMethods<U>>;
};

✅ Example of correct code

type TestFunction<T extends Test = Test> = ((message: string, fn: (t: T) => void) => void) & {
    extend<U extends CustomOperator = Record<PropertyKey, never>>(operators?: U): TestFunction<T & OperatorsToMethods<U>>;
};

Comparison

Linter	Rule	Fix
🐊 Putout	`typescript/convert-namespace-to-global`	✅
🦕 Deno	`bun-types`	❌

remove-duplicates-from-union

❌ Example of incorrect code

type x =
    | boolean[]
    | A
    | string
    | A
    | string[]
    | boolean[];

✅ Example of correct code

type x =
    | boolean[]
    | A
    | string
    | string[];

remove-duplicate-exports

In JavaScript duplicate exports leads to SyntaxError, anyways TypeScript parses such code and reports Duplicates Identifier diagnostic.

It gives us ability to automate fixing of such code 😏. Check it out in 🐊Putout Editor.

❌ Example of incorrect code

export {
    a,
    hello,
    a,
    world,
};

✅ Example of correct code

export {
    hello,
    a,
    world,
};

☝️ The rule fits good with putout/add-newlines-between-specifiers of eslint-plugin-putout.

remove-getter-arguments

The get syntax binds an object property to a function that will be called when that property is looked up

(c) MDN

❌ Example of incorrect code

export interface IParamsConstructor {
    get [fromArray](name: string): IParams;
}

✅ Example of correct code

export interface IParamsConstructor {
    get [fromArray](): IParams;
}

remove-setter-return-type

The set syntax binds an object property to a function to be called when there is an attempt to set that property.

(c) MDN

❌ Example of incorrect code

export interface IParamsConstructor {
    set fromArray(values: ParamsArray): string;
}

✅ Example of correct code

export interface IParamsConstructor {
    set fromArray(values: ParamsArray);
}

remove-useless-types-from-constants

❌ Example of incorrect code

const x: any = 5;

✅ Example of correct code

const x = 5;

remove-unused-types

❌ Example of incorrect code

type n = number;
type s = string;

const x: n = 5;

✅ Example of correct code

type n = number;

const x: n = 5;

remove-useless-types

❌ Example of incorrect code

type oldType = {
    a: number;
    b: string;
};
type newType = oldType;

const x: newType = {
    a: 5,
    b: 'hello',
};

✅ Example of correct code

type oldType = {
    a: number;
    b: string;
};

const x: oldType = {
    a: 5,
    b: 'hello',
};

remove-useless-parens

Check it out in 🐊Putout Editor.

❌ Example of incorrect code

const m: X[] = [];
const z: X | Y = 5;
const f: X = 5;

✅ Example of correct code

const x: X[] | Y[] = [];
const m: X[] = [];
const z: X | Y = 5;
const f: X = 5;

remove-useless-promise

Check it out in 🐊Putout Editor.

❌ Example of incorrect code

function doStuff(): Promise<string> {
    return 'hello';
}

✅ Example of correct code

function doStuff(): string {
    return 'hello';
}

remove-useless-mapped-types

Remove useless mapped types.

❌ Example of incorrect code

type SuperType = {
    [Key in keyof Type]: Type[Key];
};

✅ Example of correct code

type SuperType = Type;

remove-useless-non-null-expressions

Checkout in 🐊Putout Editor.

❌ Example of incorrect code

const bar = foo!!.str;
const baz = bar!?.n;

✅ Example of correct code

const bar = foo!.str;
const baz = bar?.n;

remove-useless-mapping-modifiers

Remove useless mapping modifiers.

❌ Example of incorrect code

type SuperType = {
    [Key in keyof Type]+?: Type[Key];
};

✅ Example of correct code

type SuperType = {
    [Key in keyof Type]?: Type[Key];
};

remove-duplicate-interface-keys

❌ Example of incorrect code

interface Hello {
    hello: any;
    hello: string;
}

✅ Example of correct code

interface Hello {
    hello: string;
}

cts-file

Run convert-esm-to-commonjs for all *.cts files with help of redlint.

Check out in 🐊Putout Editor.

mts-file

Run convert-esm-to-commonjs for all *.mts files with help of redlint.

Check out in 🐊Putout Editor.

find-file

Checkout in 🐊Putout Editor.

❌ Example of incorrect code

__putout_processor_filesystem(['/', [
    '/hello.ts',
    'const a: number = 5;',
]]);

✅ Example of correct code

__putout_processor_filesystem([
    '/',
    ['/hello.ts', 'const a = 5;'],
]);

rename-file-cts-to-ts

Rename *.cts files when type === "commonjs":

 /
 |-- package.json
 `-- lib/
-     `-- hello.cts
+     `-- hello.ts

Check out in 🐊Putout Editor.

rename-file-mts-to-ts

Rename *.mts files when type === "module":

 /
 |-- package.json
 `-- lib/
-     `-- hello.mts
+     `-- hello.ts

Check out in 🐊Putout Editor.

License

MIT

GeezerVison

Expand file tree

plugin-typescript

Directory actions

More options

Directory actions

More options

Latest commit

History

plugin-typescript

Folders and files

parent directory

README.md

@putout/plugin-typescript

Install

Rules

Config

apply-as-type-assertion

❌ Example of incorrect code

✅ Example of correct code

apply-utility-types

❌ Example of incorrect code

✅ Example of correct code

apply-type-guards

❌ Example of incorrect code

✅ Example of correct code

convert-generic-to-shorthand

❌ Example of incorrect code

✅ Example of correct code

Comparison

convert-commonjs-to-esm

❌ Example of incorrect code

✅ Example of correct code

convert-esm-to-commonjs

❌ Example of incorrect code

✅ Example of correct code

convert-namespace-to-global

❌ Example of incorrect code

✅ Example of correct code

Comparison

convert-empty-type-literal-to-record

❌ Example of incorrect code

✅ Example of correct code

Comparison

remove-duplicates-from-union

❌ Example of incorrect code

✅ Example of correct code

remove-duplicate-exports

❌ Example of incorrect code

✅ Example of correct code

remove-getter-arguments

❌ Example of incorrect code

✅ Example of correct code

remove-setter-return-type

❌ Example of incorrect code

✅ Example of correct code

remove-useless-types-from-constants

❌ Example of incorrect code

✅ Example of correct code

remove-unused-types

❌ Example of incorrect code

✅ Example of correct code

remove-useless-types

❌ Example of incorrect code

✅ Example of correct code

remove-useless-parens

❌ Example of incorrect code

✅ Example of correct code

remove-useless-promise

❌ Example of incorrect code

✅ Example of correct code

remove-useless-mapped-types

❌ Example of incorrect code

✅ Example of correct code

remove-useless-non-null-expressions

❌ Example of incorrect code

✅ Example of correct code

remove-useless-mapping-modifiers

❌ Example of incorrect code

✅ Example of correct code