Visual Studio Code 개발 환경 복사하기

부트캠프에서 실습을 지원해주는 데스크탑을 이용해서 하고,

복습으로 노트북을 이용해서 개발을 진행했었다.

 

그런데 너무 불편한 점..!

부트캠프에서 배웠던 설치방법이 제대로 기억나지 않아서

여기저기 찾아서 했더니 뭔가 환경이 달라졌다..

 

그래서 vs code의 환경을 복사해보려고 한다.

설명하기 쉽게 노트북 -> 데스크탑으로 설정을 옮긴다고 가정하자.

 

환경 설정을 복사하는 방법은 크게 두가지로 나뉜다.

(1) VS Code의 Setting Sync 기능을 사용하는 방법

(2) 수동으로 설정과 확장 프로그램을 복사하는 방법

 

1번 방법은 간단하다.

(노트북)VS Code를 열고 계정 아이콘을 클릭해서 "Turn on Settings Sync"옵션을 선택해서 동기화할 항목을 선택한다.

(데스크탑) 동일한 방법으로 로그인 후, "Turn on Settings Sync" 선택. 자동으로 동기화.

 

1. 기존에 설치되어 있던 확장 파일을 확인한다.

여기서 문제, VS Code에 설치한 확장 프로그램을 어떻게 외우고 다니겠는가?

이럴 때 설치한 확장 프로그램의 리스트를 저장할 수 있는 명령어가 있다.

 

1-1. 노트북의 VS Code를 열어 터미널을 연다.

1-2. 다음 명령어를 실행하여 설치된 확장 프로그램 목록을 파일로 저장한다.

code --list-extensions > extensions-list.txt

 

이 명령어를 실행하면 VS Code가 설치된 모든 확장 프로그램의 목록이 'extensions-list.txt'파일에 저장된다.

 

2. extensions-list.txt 파일을 이용해 확장 프로그램을 설치한다.

2-1. 노트북에서 생성한 extensions-list.txt파일을 데스크탑으로 옮긴다.

2-2. 데스크탑에서 VS Code를 실행하고 터미널을 연다.

2-3. 다음 명령어를 실행하여 목록에 있는 확장 프로그램들을 설치한다.

//Window버전
//extensions-list 파일 확인
Get-Content -Path "extensions-list.txt"

//확장 프로그램 설치
Get-Content -Path "extensions-list.txt" | ForEach-Object { code --install-extension $_ }

 

이렇게 하면 기존 컴퓨터에 있던 확장 프로그램을 그대로 설치할 수 있다.

하지만, 각 확장 프로그램에서의 환경 설정이나 확장 프로그램이 아닌 VS Code 자체의 환경 설정은 복사되지 않는다.

이를 위해서 다음 단계를 진행해야 한다.

 

3. 노트북에서 설정 파일을 복사한다.

3-1. C:\Users\<사용자명>\AppData\Roaming\Code\User 경로의 settings.json파일을 복사한다.

3-2. 이 폴더를 데스크탑의 동일한 경로의 파일을 지우고 붙여 넣는다.

 

User폴더에는 설정, 키 바인딩, 스니펫, 설치된 확장 프로그램의 목록 등이 포함되어 있다.

 

위 설명은 위도우를 기준으로 한 것이고, mac과 Linux는 아래 경로를 복사하면 된다.

 

• macOS: ~/Library/Application Support/Code/User/settings.json
• Linux: ~/.config/Code/User/settings.json

 

4. VS Code를 재시작한다.