[setting] vue3 snippet - script태그가 먼저오도록 정렬

dev-riverkim·2023년 10월 23일
0

vue-vscode-snippets 같은 플러그인을 사용할 때 만들어지는 snippet 정렬을 변경해보자

보통 아래와 같은 형식으로 snippet을 사용했으나

<template>
  <div>
 
  </div>
</template>
 
<script setup>
 
</script>
 
<style scoped>
 
</style>

최근에는 아래와 같은 형태로 많이 쓰이고 있음 (공식문서 참고 https://vuejs.org/style-guide/rules-recommended.html#single-file-component-top-level-element-order)

<script setup>
 
</script>
 
<template>
  <div>
 
  </div>
</template>
 
<style scoped>
 
</style>

작업 폴더 경로에 들어가서 터미널에 입력

mkdir -p .vscode && curl -L https://raw.githubusercontent.com/sdras/vue-vscode-snippets/943ccfc9ba0b3b85d05dfc8b6f9e220db8ebc81e/snippets/vue.json -o .vscode/vue.json.code-snippets

.vscode 경로에 vue.json.code-snippets 파일이 생성되며

vue 파일에서 vbase~를 입력할 때 나오는 추천 snippet에 vbase-3-ts-setup-first 를 선택하면 가 먼저 나오게 된다.

VSCode User Snippets에 관련된 내용을 찾으면 더 세세한 설정이 가능하다.

https://musma.github.io/2019/08/12/vscode-code-snippets.html

profile
dev-riverkim

0개의 댓글