VS Code

설정

VS Code

sooros51327/23/2022설정 VSCode

VS Code 설정 파일 열기

VS Code에 기본 설정 파일이 있는데 settings.json이라고 있다. Alt + , or ⌘ + , 눌러서 나오는 설정은 이 설정 파일을 설정하기 쉽게 표시해주는 역할이다. 파일을 직접 수정하면 더 세세한 설정이 가능하다.

이 파일에 접근하는 방법은 2가지가 있는데

1. 기본 설정 화면에서 빨간 부분 클릭. 파일로 여는 버튼이다

2. Ctrl + Shift + P or ⌘ + Shift + P 눌러서 settings.json 입력 후 기본 설정 열기(json) 클릭

2개 방법중 하나를 하면 settings.json파일이 열린다.

CLI에서 code 명령어가 안될 때

터미널에서 code ./ 같이 현재 경로를 vscode로 열고 싶을 때 명령어가 안될 때가 있다. PATH에 vscode를 등록해야 사용이 가능하다.

솔루션

vscode에서 Command Palette(⌘ + Shift + P) 를 열고 PATH를 입력하면 code 명령 설치가 나온다.

설치하고 터미널 재시작 하면 code 명령어가 정상 작동함

SynthWave '84

코드에 glow효과를 주는 vscode 확장 프로그램이다.

https://marketplace.visualstudio.com/items?itemName=RobbOwen.synthwave-vscode

확장프로그램을 설치하고 테마 설정 후 Ctrl + Shift + P or ⌘ + Shift + P 눌러서 Enable Neon Dreams 검색해서 Neon을 켜주면 glow효과가 적용 된다

settings.json에서 synthwave84.brightness 속성 이름으로 0~1까지 brightness 조절도 가능 하다 기본 brightness값은 0.45

typescript

"synthwave84.brightness": 0.45

스크롤바에 깃 변경사항 숨기기

vscode를 쓰다 보면 스크롤바에 여러가지 정보가 표시가 된다. 초록색은 추가, 파란색은 변경, 빨간색은 삭제, 노란색은 검색된 단어들, 회색은 선택된 단어와 동일한 단어들, 이 5가지가 스크롤 부분에 대환장 파티를 이룬다. 검색된 단어를 스크롤에서 보기도 힘들고 이게 너무 불편해서 색을 바꾸는 방식으로 끄는 설정이 존재함. 컬러를 커스터마이징 해주면 되는데 vscode설정 파일(settings.json)에서 아래 내용을 넣으면 적용된다. 2개가 있는데 필요한 부분만 입력

json

"workbench.colorCustomizations": {
  // 라인 옆부분에 표시되는 정보들 숨기기
  "editorGutter.addedBackground": "#0000",
  "editorGutter.modifiedBackground": "#0000",
  "editorGutter.deletedBackground": "#0000",
  // 라인 옆부분에 표시되는 정보들 숨기기

  // 스크롤바에 표시되는 정보들 숨기기
  "editorOverviewRuler.addedForeground": "#0000",
  "editorOverviewRuler.modifiedForeground": "#0000",
  "editorOverviewRuler.deletedForeground": "#0000",
  // 스크롤바에 표시되는 정보들 숨기기
},

라인 옆부분에 표시되는 정보들

스크롤바에 표시되는 정보들

View Archive