리액트 태그 자동완성 + Prettier 설정

1. 탭으로 태그 자동완성이 안 될 때

1. Ctrl+Shift+P -> setting.json

2. 밑의 코드를 추가해준다.

{
  "emmet.syntaxProfiles": {
    "javascript": "jsx" 
  },
    "emmet.includeLanguages": {
      "javascript": "html"
    }
}

2. Prettier 설정

코드 포맷팅 할 때 유용한 Prettier. 세미콜론 붙이고 아무렇게나 되어있는 코드 간격도 정리하자.

1. Prettier 설치한다.
   

2. Ctrl+Shift+P -> setting.json

3. 밑의 코드를 추가해준다.

{
  // Prettier 설정
  "editor.defaultFormatter": "esbenp.prettier-vscode", // Prettier를 기본 포맷터로 설정
  "prettier.semi": true, // 세미콜론 자동 추가
  "editor.formatOnSave": true // 저장할 때마다 자동 포맷
}

4. ctrl+ , 로 설정에 들어가서 검색창에 'Editor: Format On Save' 검색하고 체크
   -> 저장할 때마다 자동 포맷

5. 검색창에 'Prettier: Semi' 검색하고 체크
   -> 세미콜론 자동 추가

++ setting.json 열 때 user은 전체 적용, workspace는 해당 프로젝트에만 적용된다.

출처: https://doishalf.tistory.com/59