Encar Extension

🚀 FEM에서 로컬vite환경 사용
사용방법: F1 -> 엔카FEM비트설정 -> 선택창 선택
주의사항
- 실행 후 커밋 전 반드시 엔카FEM비트끄기 실행하여야한다.
- package.json에 새로운 라이브러리가 추가되는 상황이면 추가를 먼저하고 실행하여야한다.
vite실행영상

vite닫는영상

⚒️ 엔카 폴더 템플릿 파일 생성
사용방법: 빈 폴더 생성 후, 우클릭 -> js 또는 ts 입력
사용이유: index.js,Component.js,Component.module.scss 3개의 파일을 만들기 번거로웠기 때문에 템플릿 사용함으로써 바로 개발 시작 가능.

👀 className cx() 변환
기본 단축키: cmd+ctrl+z
사용이유: 마크업 개발시 classname 자동완성을 사용하여 빠르게 개발후 단축키로 cx("") 한번에 바꿔주기 위함

🔫 scss파일 정리
기본 단축키: cmd+ctrl+x
사용이유: "width: 100%" :뒤에 공백을 지워줘요 || .test{width:100%;} -> 끝에 있는;를 지워줘요

🛸 파일 한번에 찾기
기본 단축키: cmd+shift+f
사용방법: 찾고자 하는 파일명을 더블 클릭 후 단축키 사용
주의사항
- 컴포넌트 이름이 파일이름과 같아야 한다.
- export {} 혹은 as로 바꾼 컴포넌트는 못찾음
- /src로 시작하는 저장소는 모두 사용가능(fem을 타겟으로 만들긴했어요)

👀 모노레포 패키지 파일 찾기
기본 단축키: cmd+shift+d
사용이유: "@encarpkg/design" 이러한 경로의 파일은 ctrl+왼쪽마우스클릭으로 한번에 찾아갈 수 없는 문제 때문
사용방법: 찾고자 하는 파일명을 더블 클릭 후 단축키 사용
참고: 중복된 파일명이 존재할 경우 프롬프트 창으로 선택 가능 & 단축키다름 주의(root경로,성능때문에 단축키를 분리함)

주의사항
테스트 코드 실행, 디버깅은 node버전 18이상으로 올리고 실행해야 해요
추가하고 싶은 익스텐션 만들고 굳이 테스트코드 작성 안해도 돼요
| |