Y.A.R.S

Yet Another React Snippets.

Snippets for React-related development for Sublime Text.

Installation

1. CMD + Shift + P → Package Control: Add Repository
2. paste in https://github.com/selrond/yars
3. CMD + Shift + P → Package Control: Install Package
4. search for yars

Snippets

• rcc - Create React Class Component skeleton

import React, { Component } from 'react';

class MyComponent extends Component {
  render() {
      return (
          <div>
          </div>
      );
  }
}

export default MyComponent;

• rfc - Create React Functional Component skeleton

import React from 'react';

const MyComponent = (props) => {
    return (
        <div>
        </div>
    );
}

export default MyComponent;

• ir - Import React

import React from 'react';

• irc - Import React Component

import React, { Component } from 'react';

• isc - Import styled-components

import styled from 'styled-components';

• scs - styled-components styled template

const StyledComponent = styled.div`
    /* CSS */
`

• sci - styled-components interpolation

${(props) => props.};

• scscp - styled-components custom props workaround

const StyledComponent = styled(({ customProp, ...rest }) => <ExistingComponent {...rest}></ExistingComponent>)`
    /* CSS */
`