Develop/React
[VSCode] 파일명으로 바로 컴포넌트 생성하기
kimpeupeu
2023. 2. 20. 10:03
저는 타입스크립트 기반으로 함수 컴포넌트를 생성할 스니펫을 만들겁니다.
{
"Create a react function component": {
// 스니펫 실행할 키워드
"prefix": "rfc",
// 실행 후 생성될 모습, 각 item이 라인이 됩니다.
// TM_FILENAME_BASE는 확장자를 뺀 현재 파일명
"body": [
"import React from \"react\";",
"",
"interface ${TM_FILENAME_BASE}Props {}",
"",
"const $TM_FILENAME_BASE: React.FC<${TM_FILENAME_BASE}Props> = ({}) => {",
"\treturn <></>;",
"};",
"",
"export default $TM_FILENAME_BASE;",
""
],
// 해당 스니펫 이름
"description": "Create a function component using Typescript"
}
}
해당 스니펫은 아래의 경로로 들어가 적용언어를 선택해 적용시켜주면됩니다.
그러면 아래와 같이 실행할 수 있습니다.
파일명을 기반으로 함수 컴포넌트가 짜잔!
귀찮은 반복 코딩을 줄이세용!
반응형