Dev/React

React ES7 React Extension Default 컴포넌트 자동완성

구 불출 2022. 2. 9. 17:49
반응형

출처 : https://meaningless-life.tistory.com/15

 

[React.js] Default 코드를 자동으로 생성해주는 모듈

React로 js를 계속 만들다 보면 Default Componet를 생성할 때 기본적으로 적어줘야 하는 코드들이 있다. import React from 'react' function TestPage() { return ( TestPage ) } export default TestPage 대충..

meaningless-life.tistory.com

import React from 'react'

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

export default Main

React 작업을 하다보면 컴포넌트를 생성할 때마다 위와 같은 코드를 반복적으로 입력해야 한다.

 

이런 귀차니즘을 해결해주는 익스텐션이 있다.

 

VSCode 익스텐션 검색창에 es7 을 입력하면 아래와 같은 모듈을 찾을 수 있을것이다.

 

설치 후 새로운 컴포넌트를 만들고 사용해보자

 

 

빈 컴포넌트에 rafce 를 입력하고 엔터를 누르면

 

예쁘게 디폴트 코드가 작성된다.

이제 편하게 사용하면 되겠다.

 

참고 

rafce : arrow function

rfce : function

fce : class 형식이다.

반응형