VS Code React Snippets

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.

Snippets

Below is a list of all available snippets and the triggers of each one.

Trigger	Content
`imr`	import react
`cn`	import classnames
`fc`	a functional component
`sfc`	a stateless functional component
`ctor`	a constructor
`bm`	bind a method to 'this'
`ss`	set state
`cdm`	componentDidMount lifecycle method
`cdu`	componentDidUpdate lifecycle method
`cwu`	componentWillUnmount lifecycle method
`scu`	shouldComponentUpdate lifecycle method
`sfp`	getDerivedStateFromProps lifecycle method
`sbu`	getSnapshotBeforeUpdate lifecycle method
`cdc`	componentDidCatch lifecycle method
Styled Components
`ssfc`	a stateless functional styled component
React Native
`ssfcn`	a RN stateless functional styled component
Material UI
`sfcs`	a staleless functional component with MUI styles
`fcs`	a functional component with MUI styles
`sty`	MUI style template
StoryBook
`st`	react storybook story

React Snippets

danmce

VS Code React Snippets

Installation

Snippets