[CSS] VSCODE emmet(에밋) 기능 더 빠르게 사용하기

 

요즘 컴퓨터 바꾼 후로 에밋 적용 속도가 좀 느려졌다고 느꼈다.

탭키나 엔터를 누르면 바로 챡 완성이 되어야하는데 살짝 기다렸다가 completions(완성 텍스트 박스?)가 뜬 후 눌러야 적용이 돼서 답답했다.

 

에밋 적용이 안된 예시

 

 

박스 기다렸다가 에밋 적용한 예시 (느림)

 

 

답답해! 0.1초도 기다리기싫어!

 

구글링ㄱㄱ

https://stackoverflow.com/questions/66994447/vs-code-emmet-being-very-slow

 

아하 탭으로 트리거 체크?

 

 

1. VSCODE에서 command palette을 연다. (F1 또는 Command+Shift+P)

2. setting을 검색해 Open User Settings에 들어간다.

 

3. 세팅 검색창에 emmet을 검색한다.

 

검색결과에서 Emmet: Trigger Expansion On Tab 을 찾아 체크박스에 체크한다.

 

Emmet: 탭에서 확장 트리거
활성화된 경우, 완료가 나타나지 않을 때도 TAB를 누를 때 Emmet 약어가 확장됩니다.
비활성화된 경우에도 표시된 완료를 TAB를 눌러서 허용할 수 있습니다.

 

'비활성화된 경우에도 표시된 완료를 TAB를 눌러서 허용할 수 있습니다.' 이 문장은 아래와 같은 동작을 의미하는 것이다.

체크해서 위처럼 completions이 안떠도 에밋 적용이 가능하도록 바꾸는 것!

 

 

설정을 바꿨으니 테스트를 해보자.

타다~

 

비포       |       애프터

 

같은 타이핑 속도로 같은 내용을 친 것이다.

왼쪽 짤은 에밋 적용이 되기 전에 엔터를 쳐서 이상하게 입력이 됨

 

확실히 더 빠르게 작업이 가능하다.

특히 CSS 여러 라인을 써내려갈때 체감이 큼!

 

그럼 이만,,