VSCode React拡張機能の snippets まとめ

説明

ES7+ React/Redux/React-Native snippets

VScode で React を利用する際 snippets を用いて開発スピードを向上させることが目的

補足情報

Name: ES7+ React/Redux/React-Native snippets
Id: dsznajder.es7-react-js-snippets
Description: Extensions for React, React-Native and Redux in JS/TS with ES7+ syntax. Customizable. Built-in integration with prettier.
Version: 4.4.3
Publisher: dsznajder
VS Marketplace Link: https://marketplace.visualstudio.com/items?itemName=dsznajder.es7-react-js-snippets

snippets 一覧

アロー関数

rafc

import React from 'react'

export const aaaa = () => {
  return (
    <div>aaaa</div>
  )
}

rafce

import React from 'react'

const aaaa = () => {
  return (
    <div>aaaa</div>
  )
}

export default aaaa

rafcp

import React from 'react'
import PropTypes from 'prop-types'

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

aaaa.propTypes = {}

export default aaaa

function 関数

• rfc
• rfcp
• rfce

基本アロー関数推奨なので実行結果は割愛