퍼블리싱/기타

VSCode 스니펫 만들기 (주석)

리리히히 2025. 3. 13. 20:46
반응형

 

 


💡 스니펫을 미리 설정해두면 빠르고 일관된 방식으로 코드를 작성할 수 있어 코드 작성 효율성을 증가시킬 수 있다.
(나는 현재까지 실무에서 주석을 달때 사용해보았다. 협업에서는 코드의 통일성이 중요하니까...)

 

📌 스니펫 설정하는 방법

  • ctrl(cmd) + shift + p 단축키를 사용하여 명령 팔레트를 연다.



  • Configure User Snippets를 검색 후 클릭




  • 특정 언어에 대한 스니펫 파일 선택
    ex) html일 경우 html, css일 경우 css 선택

 
 

  • 스니펫 만들기
    html을 선택하면 좌측에 html.json이란 json 파일이 생기는 것을 확인 할 수 있다.
//html.json 주석 스니펫 만들기
{
  "comment": {
    "prefix" : "comment",
    "body": [
      "$BLOCK_COMMENT_START $CURRENT_YEAR-$CURRENT_MONTH-$CURRENT_DATE 내용 ${1: comment} $BLOCK_COMMENT_END"
    ],
    "description": "html 주석내용"
  }
}
  • prefix: 스니펫을 트리거하는 단어나 문구, ‘문자열’이나 ‘문자열 배열’로 설정할 수 있다.
  • body: 스니펫에 실제 들어가는 내용, 각 문자열은 스니펫 한줄을 의미
  • description: 스니펫에 대한 간단한 설명



prefix에서 설정한 단축어를 입력한 후 Tab키를 누르면 스니펫이 실행 된다.
협업에서 스니펫을 잘 활용하면 일의 효율이 확실히 상승하겠다...!

일단 오늘은 여기까지만 정리.


 





반응형