[Visual Studio Code] 다시 시작없이 실시간 확인 법

웹사이트를 변경했는데 매번 f5를 누르고나 서버를 다시 키거나 하면

 

번거로워질수가 있다.

 

이것을 해결하고자

 

vscode에서 지원하는 live server를 활용할 것이다.

 

왼쪽 메뉴탭에 ㅁ 를 누른뒤 live server 라고 치면 나올 것이다.

 

liver preview라고 쳐도 나온다.

 

필자는 이미 설치를 했기에 저런 표시가 나온다

 

 

 

 

설치가 끝났으면  작성할 프로젝트를 열어주고

 

해당 html 파일을 오른쪽 버튼한 후 open with liver server 클릭

 

그러면 이제 

 

 

오른쪽 밑에 5500 포트가 열렸다고 뜰것이다.

 

http://127.0.0.1:5500/해당 파일 경로html

 

주소창에 검색해주면 뜰 것이다.

 

그리고 vscode 에서 ctrl + ,  눌러주면 검색창이 뜨는데

 

auto save 검색 후 

 

아래와 같이 입력

 

더 빠르게 저장하고 싶으면 300(0.3) 해도 된다.

 

600이 적당

 

 

 

이제 그럼 바로바로 수정 하러 가봅시다.~~