특정 프로젝트에만 VS Code 설정 적용하기

Problem

Node.js 교과서(조현영著)의 프론트단 실습코드에서 다음과 같은 에러가 발생했다.

react를 배우지 않은 독자를 상정하다보니 보다 쉬운 nunjucks로 프론트를 구현했는데 html 템플릿 문법 중 하나가 말을 듣지 않았다. (프론트 코드는 모두 복붙했음에도 에러가 났음)

Solution

StackOverFlow에 찾아보니, 코드 상의 문제인지는 모르겠지만 VS Code의 설정을 바꾸면 더 이상 에러가 튀어나오지 않는다고 한다.

(다들 nunjucks던, Django던 html 템플릿 문법 때문에 애를 먹는 것 같았다.)

저 HTML > Validate: Styles 속성의 체크를 풀면 에러가 사라진다.

그런데, 이 때 VS Code의 세팅 자체를 변경해버리면 현재 문제가 되는 프로젝트 외에도 VS Code를 통해 편집하는 코드애 적용이 된다.
당장 에러는 해결했지만, 1-2년 뒤에 내가 무슨 설정을 건드렸는지도 기억을 못하게 될 때 요상한 나비효과가 일어난다면 골치 아파질 것이다.

특정 프로젝트에만 VS Code의 세팅을 적용해보자.

1. .vscode 폴더를 프로젝트의 root directory에 생성한다.
2. .vscode 폴더 안에 settings.json 파일을 생성한다.
3. 해당 프로젝트에만 적용하고 싶은 설정들을 json 문법에 맞춰 작성.

내 문제의 경우, 다음 코드를 입력했더니 정상적으로 적용이 되었고 에러가 사라졌다.

...

{
  "html.validate.styles": false
}

Reference

• https://stackoverflow.com/questions/57352156/error-property-value-expected-css-and-at-rule-or-selector-expected-css-editi