그리고 JSON 파일 안에 방금 복사한 Snippet을 붙여 넣고 저장하세요.

{
"Styled React Functional Component": {
  "prefix": "srfc",
  "body": [
    "import React from 'react';",
    "import styled from 'styled-components';",
    "",
    "const ${TM_FILENAME_BASE}Block = styled.div``;",
    "",
    "const ${TM_FILENAME_BASE} = () => {",
    "  return (",
    "    <${TM_FILENAME_BASE}Block>",
    "      ",
    "    </${TM_FILENAME_BASE}Block>",
    "  );",
    "};",
    "",
    "export default ${TM_FILENAME_BASE};",
    ""
  ],
  "description": "Styled React Functional Component"
}
}

이제 이 Snippet을 사용해 봅시다. 나중에 만들 컴포넌트 중에서 Header 컴포넌트를 만들어 보겠습니다. 이 컴포넌트는 components/base 경로에 저장합니다. base는 프로젝트의 기반을 의미합니다.