본문 바로가기

VSCode

[VSCode] Live Server 포트 변경 및 적용 안되는 오류 해결

Port 변경하기

VSCode에서 Live Server 플러그인을 통해 서버를 열때 포트 번호를 변경하는 방법은 아래와 같다.

 

1. VSCode에서 마켓플레이스에 Live Server를 검색한다. 해당 플러그인의 우측 아래 톱니바퀴를 클릭하고 확장 설정을 선택한다.

2. 이동한 곳에서 port number를 검색한 후 아래 settings.json에서 편집을 클릭한다.

 

3. 아래와 같이 원하는 port를 설정해준다.

 "liveServer.settings.port": 3000,

 

4. 서버를 실행하면 설정한 port로 열린다.

VSCode 우측하단에 Go Live 를 클릭하여 서버를 키거나 

index.html에서 우측클릭하여 Open with Live Server 클릭하여 서버를 킨다.

 


Port 변경이 적용되지 않는 이슈 해결

이슈: 위의 방법대로 port변경을 했으나 적용되지 않고 다른 port로 열리는 현상 발생

원인: 상위 설정한 setting.json이 적용되어야 하나 프로젝트 내에 setting.json이 따로 생겨서 우선 적용되어 설정했던 세팅이 적용되지 않았다.

해결: 해당 프로젝트 내의 폴더에서 .vscode> setting.json 파일을 삭제한다. 그리고 다시 서버를 열면 변경했던 port로 정상 적용된다.

참고사이트