Live Server 오류 및 해결방법 - vscode 초기화(는 무서워)

문제 상황

 분명 live server를 설치했으나 작동이 안 되었다.
이후 node.js 를 쓰며 잊고 있다가 다시금 알게 된 오류.

 

정상적으로 작동한다면, vscode에서 코드 작성하고 저장하자마자
자동으로 변동사항이 적용되어야 한다.
그것도 모르고 계속 새로고침만 했다. 하하

---

live server 오류는 단일적인 문제가 아니어서 여러 시도를 해봐야 한다. 구글링 해보니 나와 비슷한 경우가 많았다.

시도한 방법들로는

1. vscode 설정에서 auto save 검색하여 off->afterDelay 로 변경
2. Auto Save Delay를 1000->600으로 변경 (0.6초)
3. live server 확장 설치 창에서 이전 버전으로 다운
4. live server 삭제 후 다시 설치 (다른 확장 프로그램들이 그대로 있음)
5. 하단 Go live 몇 번이고 눌러보기
6. option+B 말고 Open with Live Server로 실행하기
   .
   .
   아무것도 되지 않았다.

 

해결 방법

마지막 남은 오류 해결 방법은 vscode를 완전히 초기화 시키기

 

혹시나 다른 파일들이 날아갈까봐 찾고 찾다가 드디어 성공한 방법!!!

>참고한 사이트<

 

맥북을 사용 중이며 실행한 방법 그대로 적어보겠다.

 

0. 설치했던 확장프로그램들 캡쳐 or 메모해두기

 

1. vscode 종료 및 삭제

• vscode 실행창을 모두 종료한다.
• 다운로드 파일과 응용 프로그램에서 vscode를 휴지통으로 옮긴 후, 휴지통도 비운다.
  
  

2. vscode 폴더 접근하기

• F4를 눌러 터미널을 켠다.
• 아래를 입력하여 vscode가 설치되어 있는 code 폴더에 접근한다.

cd ~/Library/Application\ Support/code

 

 

3. 한 폴더 밖으로 나와 code 폴더 삭제

cd ../

를 입력하여 code 파일에서 나온다.
(pwd는 현재 내 위치를 확인하는 명령어)

• VSCode의 설정 파일과 사용자 데이터는
  ~/Library/Application Support/Code 디렉토리에 저장되므로
  터미널을 열고 아래 명령어를 실행하여 해당 폴더를 삭제한다.
  혹여나 다른 파일들에 영향이 없도록 오타를 주의한다!

rm -rf ~/Library/Application\ Support/Code

--> 여기까지만 실행하고 다시 설치하면,
확장 프로그램이 그대로 있어 오류해결이 되지 않았다.

 

 

4. 캐시 및 설정 데이터 삭제

캐시 파일과 로컬 저장소 데이터는 ~/Library/Caches/com.microsoft.VSCode와

~/Library/Application Support/Code에 있다.

아래 명령어를 사용하여 이 폴더들도 삭제한다.

rm -rf ~/Library/Caches/com.microsoft.VSCode

rm -rf ~/Library/Saved\ Application\ State/com.microsoft.VSCode.savedState

한 줄 치고 엔터, 마저 치고 엔터 누르기!

 

 

5. 확장 프로그램 삭제
설치된 확장 프로그램은 ~/.vscode/extensions 폴더에 저장된다.
이 폴더를 삭제하여 확장 프로그램도 제거한다.

rm -rf ~/.vscode/extensions

 

4번까지 진행하면 깔끔하게 vscode를 초기화 할 수 있다.
이 후 다시 설치하고 

• live server 먼저 설치하여 상태 확인해보기!
• 이전에 깔았던 확장프로그램 하나씩 재설치해보며 충돌이 발생하진 않는지 일일이 확인해보기!
  
  

까지 하면 완료!

 

+) 다운로드 파일에서 바로 실행이 안 된다면 '응용 프로그램'으로 vscode를 옮겨본다.