Visual Studio Code(현재 1.34.0버전, 이후 VS Code로 표기)에서 라이브 서버를 설정하는 방법에 대해 살펴보자.

라이브 서버를 이용하면 파일 수정 후 저장하면 수정된 내용이 바로 저장된다.


1. 라이브 서버 설치하기

2. 라이브서버 테스트하기


1. 라이브 서버 설치하기

  • VS Code 실행 후 파일 > 기본설정 > 확장 메뉴를 클릭한다.
  • 또는 단축키로 Ctrl + Shift + X를 같이 누른다.


  • 검색창에서 live server를 검색 설치버튼을 클릭한다.


2. 라이브 서버 테스트하기

  • 왼쪽 상단에 탐색기 아이콘 클릭하여 확장 메뉴 제거한다.


  • 탐색기에서 폴더 열기를 클릭하여 열 폴더를 지정한다.


  • 새파일 아이콘을 클릭 후 파일명에 test.html을 입력하여 html 파일을 생성한다.


  • 좌측 코드 탭에서 html:5를 입력하면 자동완성이 되는데 엔터를 쳐서 기본 코드를 생성한다.


  • 좌측 코드 탭을 우클릭한 후 Open with Live Server 메뉴를 클릭한다.
  • 또는 단축키로 Alt + L 입력 후 Alt + O를 누른다.


  • 실행결과

도움이 되셨다면 광고 클릭!

+ Recent posts