Code Spell Checker でスペルミスをチェックする [VSCode]

こんにちは!もとひろです。
今回は、VSCode拡張機能であるCode Spell Checkerについて書きたいと思います。


Code Spell Checkerとは

VSCode拡張機能で使えるスペルチェッカーです。
インストールすると、スペルミスを見つけた際にすぐ見つけてくれます。

下画像はamericaamerikaとしてしまったときの例です。
amerikaの下に波線が出ていてすぐに気づくことができます!
波線が出ているときはVSCode問題のウィンドウでスペルミスが取り上げられています。



スペルミスを指摘されている単語にカーソルを合わせると電球マークが表示され、その電球マークを押すとスペルミスしている単語から推測される単語が表示されます。



推測された単語から選ぶ、もしくはスペルミスを自分で直すと波線が消えます。
問題からもスペルミスがなくなったことが分かります。



とても便利な機能ですね!

また、ホワイトリストに特有の固有名詞や辞書にない単語などを登録することで、スペルミスとして出ないようにすることができます。
詳しくはこちらを参考にしてください。
参考リンク:『Code Spell Checker』でUnknown word(スペルミス)判定されないために単語を除外する方法と解除方法 | みみほくろの小耳にはさむ話

インストール方法

こちらからインストールできます↓
marketplace.visualstudio.com
VSCode拡張機能欄で「Code Spell Checker」で検索してインストールすることもできます。
冒頭に「Spanish - 」や「German - 」などがついているものも出てきますが、言語名のついていない「Code Spell Checker」で良いかと思います。

注意点

Code Spell Checkerは初期設定ではRubyのファイルに対応していません!!!
自分でRubyで書かれたファイルを検知するよう追加で設定する必要があります。

設定方法

設定方法は2つあります。
どちらも結局同じことをやっているので、やりやすい方で良いかと思います。

設定画面のみで設定する方法

  1. 設定画面を開く
    左下の歯車アイコンをクリック or command + ,(カンマ)

  2. 検索にC Spell:Enabled Language Idsと入力する

  3. 言語が並んでいる下にある「項目を追加」をクリック

  4. rubyと書き足して「OK」をクリック

設定ファイルを開く方法

  1. 設定画面を開く
    左下の歯車アイコンをクリック or command + ,(カンマ)

  2. 右上のアイコンをクリック

    するとsetting.jsonファイルが開きます。

  3. "cSpell.enabledLanguageIds""ruby"を追加して保存する


    これでRubyのファイルをスペルチェックしてくれるようになりました!
    もし他の言語でスペルチェックされないものがあるようであれば、上記方法で確認してみてください。

まとめ

いかがでしたか?
Rubyのファイルが初期設定にないことに気づかず結構苦戦したので今回まとめてみました!
VSCodeでスペルミスが気になる方はぜひインストールしてみてください!

参考リンク

VSCode に Code Spell Checker を導入して typo と戦う - Qiita
Visual Studio CodeでCode Spell Checkerが有効にならないときの解決方法 - 忘備録
VSCodeでスペルミスを指摘してくれるCode Spell CheckerをRuby言語に対応させる - Qiita
『Code Spell Checker』でUnknown word(スペルミス)判定されないために単語を除外する方法と解除方法 | みみほくろの小耳にはさむ話


おまけの話

先日プラクティスの提出物で変数名を命名した際、receiverecieveとしてしまっていました…
(打ち間違いではなく単語を間違って認識していたので余計に恥ずかしかったです)
その際に、スペルチェックができる拡張機能があるかも〜と教えていただきました!
自分が困ったときには先人がなにかしらの策をたててくれているので助かりますね!
そして、私はちゃんと英語の勉強をしようと思ったのでした…


終わります👋