ctrl+shift+p filters: :st2 :st3 :win :osx :linux
Browse

Babel Snippets

by babel ALL

Next generation JavaScript and React snippets for Sublime

Details

Installs

  • Total 179K
  • Win 81K
  • Mac 70K
  • Linux 28K
Oct 24 Oct 23 Oct 22 Oct 21 Oct 20 Oct 19 Oct 18 Oct 17 Oct 16 Oct 15 Oct 14 Oct 13 Oct 12 Oct 11 Oct 10 Oct 9 Oct 8 Oct 7 Oct 6 Oct 5 Oct 4 Oct 3 Oct 2 Oct 1 Sep 30 Sep 29 Sep 28 Sep 27 Sep 26 Sep 25 Sep 24 Sep 23 Sep 22 Sep 21 Sep 20 Sep 19 Sep 18 Sep 17 Sep 16 Sep 15 Sep 14 Sep 13 Sep 12 Sep 11 Sep 10 Sep 9
Windows 8 13 26 21 15 16 23 13 22 16 28 19 25 17 17 16 29 14 33 22 15 11 21 17 12 18 21 22 18 26 30 22 25 11 24 17 21 27 19 23 26 28 14 11 26 25
Mac 5 6 7 16 9 10 5 8 4 10 6 9 5 10 8 4 7 17 7 10 6 8 4 13 12 15 11 7 8 8 12 13 11 13 11 5 7 20 3 7 14 6 5 5 6 9
Linux 1 2 7 7 4 4 3 3 3 4 4 13 6 4 5 3 8 14 5 8 5 4 5 6 3 3 4 6 4 4 2 8 4 5 4 5 4 8 6 3 8 7 3 3 6 4

Readme

Source
raw.​githubusercontent.​com

babel-sublime-snippets

Sublime snippets for React in ES5 and ES6 flavors.

Installation

Find it as Babel Snippets through Package Control.

Using the “React: wrap in a component” snippet

First, select a block of JSX. Then, from the Command Palette select “React: wrap in a component”. Or, you can set up a key binding.

To set a key binding, go to “Preferences: Key Bindings - User” from the Command Palette and add an entry like this:

{
  "keys": ["ctrl+shift+,"],
  "command": "insert_snippet",
  "args": {
    "name": "Packages/Babel Snippets/react_wrap.sublime-snippet"
  }
}

Available snippets

React

Trigger Content
rcc→ class component skeleton
rcc→ legacy component skeleton
cdm→ componentDidMount() {…}
cdup→ componentDidUpdate(prevProps, prevState) {…}
cwm→ componentWillMount() {…}
cwr→ componentWillReceiveProps(nextProps) {…}
cwun→ componentWillUnmount() {…}
cwup→ componentWillUpdate(nextProps, nextState) {…}
fdn→ React.findDOMNode(…)
gdp→ getDefaultProps() {…}
gis→ getInitialState() {…}
ren→ render() {…}
sst→ this.setState(…)
scu→ shouldComponentUpdate(nextProps, nextState) {…}
props→ this.props
state→ this.state
pt→ propTypes { ... }
pta→ PropTypes.arrayOf
ptai→ PropTypes.arrayOf (Instances)
ptb→ PropTypes.bool
pte→ PropTypes.element
ptf→ PropTypes.func
pti→ PropTypes.instanceOf
ptn→ PropTypes.number
ptn→ PropTypes.node
pto→ PropTypes.object
ptof→ PropTypes.oneOf (Enum)
ptof→ PropTypes.objectOf
ptoft→ PropTypes.oneOfType (Union)
pts→ PropTypes.string
ptsp→ PropTypes.shape

Notes

  • Unsupported React API snippets: displayName, forceUpdate, getDOMNode (use React.findDOMNode), ismounted, mixins, replaceProps, replaceState, setProps, statics.

Snippet(ing)

Read Extending Sublime Text » Snippets.