Awesome

vscode-react-typescript

This extension contains code snippets for React with Typescript.

Installation

In order to install an extension you need to launch the Command Pallete (Ctrl + Shift + P or Cmd + Shift + P) and type Extensions. There you have either the option to show the already installed snippets or install new ones.

Launch VS Code Quick Open (Ctrl + P or Cmd + P), paste the following command, and press enter.

ext install vscode-react-typescript

Alternatively you can open the extensions panel and search for 'Typescript React code snippets'.

Supported languages (file extensions)

TypeScript (.ts)
TypeScript React (.tsx)

Snippets

Below is a list of all available snippets and the triggers of each one. The ⇥ means the TAB key.

Trigger	Content
`tsrcc→`	`class component skeleton`
`tsrcfull→`	`class component skeleton with Props, State, and constructor`
`tsrcjc→`	`class component skeleton without import and default export lines`
`tsrpcc→`	`class purecomponent skeleton`
`tsrpcjc→`	`class purecomponent without import and default export lines`
`tsrpfc`	`pure function component skeleton`
`tsdrpfc`	`stateless functional component with default export`
`tsrsfc`	`stateless functional component`
`conc→`	`class default constructor with props and context`
`cwm→`	`componentWillMount method`
`ren→`	`render method`
`cdm→`	`componentDidMount method`
`cwrp→`	`componentWillReceiveProps method`
`scu→`	`shouldComponentUpdate method`
`cwu→`	`componentWillUpdate method`
`cdu→`	`componentDidUpdate method`
`cwum→`	`componentWillUnmount method`
`gdsfp→`	`getDerivedStateFromProps method`
`gsbu`	`getSnapshotBeforeUpdate method`
`sst→`	`this.setState with object as parameter`
`bnd→`	`binds the this of method inside the constructor`
`met→`	`simple method`
`tscntr→`	`react redux container skeleton`
`imt`	`create a import`

License

MIT