코드 오타 방지 위원회 : Code Spell Checker 플러그인 사용하기. (VSCode)

작성 : 2023-07-31수정 : 2024-03-29

목차 펼치기

머리말

코드의 오타는 기능상 문제가 되지 않더라도 코드의 질을 떨어뜨리고, 문맥을 파악할 때 혼란을 야기할 수 있다. 특히 코드를 작성하다보면, 종종 오타라고 잘 인지되지 않는 단어들도 있다. 이런 경우를 위해 VSCode의 플러그인 Code Spell Checker를 통해 오타를 방지해보자.

자주 발생할 수 잇는 오타들은 다음과 같으며, 이 외에도 무궁무진하다.

process vs prosess
speech vs speach
success vs sucess
waiting vs wating
inventory vs invetory
recommend vs recomend
coming vs comming
referer vs referrer, 특히 이 케이스는 오타가 정규 스펙에 등재되어 버린 놀라운 사례다.

특히 IDE Intellisense, 복사, 붙여넣기 등을 하다보면 프로젝트가 오타에 잠식당할 수 있다.

Code Spell Checker란

오타를 바로 알려주기 위한 플러그인으로 VSCode의

Code Spell Checker

가 있다. 오탈자에 밑줄을 그어 개발자가 빨리 해결하고 싶게 만들며 현재는 영어만 지원하고 있다.

하지만 서비스를 개발하다보면, 사전에 등재되지 않은 단어를 사용하는 게 필요할 때가 있다. 이 플러그인은 사용자가 특정 단어들을 예외처리할 수 있도록 지원한다.

기본 검사 규칙

카멜 케이스, 스네이크 케이스는 각각의 대소문자로 분리한다.
대소문자 구분 없이 영어만 지원 가능하다
길이가 3자 초과인 단어만 검사한다.
모든 기호와 구두점은 무시된다.

VSCode 플러그인 설치

Extension 탭으로 이동한다. (
Cmd
+
Shift
+
X
)
Code Spell Checker를 검색 후 설치한다.

커스텀 단어 설정

특정 단어를 예외처리 하는 방법에는 두 가지가 있는데, VSCode 설정에 추가하거나, 프로젝트 내 플러그인 설정 파일을 추가해서 진행할 수 있다. 여기서는 간단히 예외처리하는 방법만 알아보고 더 자세한 내용은 공식 문서에 잘 설명되어있다.

단순히 오타에 밑줄을 지우기 위해서는

ignore

를 사용하고, 올바른 단어로 취급해서 단어 추천 목록에도 나타나게 하기 위해서는

words

키워드를 사용한다.

VSCode 설정 변경

json

1{
2	...
3	// Words to add to dictionary for a workspace.
4  "cSpell.words": ["weezip", "treefeely", "ethan"]
5}

/.vscode/settings.json

파일의 설정을 변경한다

플러그인 설정 변경

json

1{
2	// Version of the setting file.  Always 0.2
3  "version": "0.2",
4  // language - current active spelling language
5  "language": "en",
6  // words - list of words to be always considered correct
7  "words": [
8      "weezip",
9      "treefeely",
10      "ethan",
11  ],
12  // flagWords - list of words to be always considered incorrect
13  // This is useful for offensive words and common spelling errors.
14  // For example "hte" should be "the"
15  "flagWords": [
16      "hte"
17  ]
18}

cspell.json

파일을 생성한다.

VSCode 일괄 변경하기

VSCode에서
Cmd
+
Shift
+
H
를 눌러 Search 탭의 일괄 변경 기능을 연다.
검색 된 내용 중 변경 후에 이슈가 없는 지 확인 후 변경한다.