Ccmmutty logo
Commutty IT
6 min read

[Visual Studio Code] おすすめの拡張機能と設定

https://cdn.magicode.io/media/notebox/6b8a7ed2-cf4f-455e-916e-9f128637293b.jpeg

Visual Studio Codeおすすめ拡張機能&設定

前の記事でVScodeをお勧めしましたが、 その使いやすさは拡張機能や便利な設定あってのこと!
初めてVScodeを触るにあたって知っておきたい機能と設定をまとめました。
インストールは上記リンクから、対応のOSに応じてダウンロードしてください。

まず最初にいれる拡張機能

Japanese Language Pack for Visual Studio Code

様々な機能があるため、とりあえず日本語化してから始めるのがおすすめ
ちなみに、初めて起動すると左下にポップアップが出てきます。
特に理由がなければここからインストールすればいいと思いますが、
人によっては気づかず消してしまったり、再度英語に戻したい人もいるかも知れません。
拡張機能インストール方法
右側にある赤丸の場所をクリックすると、インストールされた拡張機能が表示されます。
日本語化に失敗した際にはjapaneseで検索していただくと、
Japanese Language Packの拡張機能が出てきます。

おすすめ拡張機能

1.プログラミング言語

私の場合ですとpythonですね。 書きたいプログラミング言語を検索ボックスに入れ、対応した拡張機能をインストール
また、その言語に便利な拡張機能を一緒にインストールしてもらえます。
例えば、pythonだと
  • Pylance
  • Jupyter
  • Jupyter Keymap
  • Jupyter Notebook Renderers
    これらが自動でインストールされます。
ついでにPythonを使う場合はindentで検索し、
  1. Python Indent
  2. indent-rainbow これらも一緒にインストールしておくと便利です。

2.git

非常に便利なバージョン管理ツール
プログラム言語に限らず、メモにも対応しているのでお勧め
  • Git History
  • GitLens
    これらをインストールしておきましょう。
    もっとも、使うにはgithubのアカウント登録諸々が必要なので、後回しにしてもいいかもしれません。

3.Theme

VScodeは見た目を変更することもできます。
Themeを入れて好きなのを選ぶだけ!
なお、おすすめは特にない。
気になった方はVScodeおすすめテーマで探してみてください

おすすめ設定

設定の変更方法

歯車のアイコンから設定を選ぶことで設定画面に行けます。
アクティビティバー(歯車が書いてあるバー)を非表示にしている場合は左上のファイル(F)からユーザー設定→設定で開きます。
設定の変更方法はGUIでの変更とsettings.jsonがありますが、基本的には後者の方が楽
一番の問題は、適当に調べて設定を変更しようとしたときにいろいろなやり方が書かれてて混乱する。
設定が複雑でよくわからないときはsettings.jsonを消してしまえば初期設定に戻る感じ(変更した場合に、jsonファイルが更新される)
settings.jsonの開き方は右上の紙?をめくるようなアイコンをクリックすれば開きます。

おすすめのsetting.json

{
  "[python]": {
    "editor.defaultFormatter": null,
    "editor.formatOnSave": true                    // ファイル保存時に自動フォーマット
  },
   "python.formatting.provider": "black",       // フォーマットにblackを使用
   "python.formatting.blackArgs": [             // 設定値以上だと改行
    "--line-length",
    "88"
  ],
  "workbench.editor.untitled.hint": "hidden", // 言語選択または~のくだりを非表示
  "editor.wordWrap": "on",                            // 文字折り返し
  "editor.wrappingIndent": "indent",              // 折り返した文字にインデントをつける
  "files.autoGuessEncoding": true,               // ファイルのエンコード自動推測
}
編集の際には,{}にはぜひ気を付けてください。
上記の設定をしていると、blackがインストールされていない仮想環境でpythonを実行する際に、
blackを入れるかどうかポップアップがでます。
新たな仮想環境にボタン一つでblackをインストールできるので便利

おすすめショートカットキー

VScodeショートカットキーpdfにキーがまとめられてあります……が、これを見て覚える気は起きないということで
あまりに基礎的になctr + sのようなは省くとして知っておくと便利なコマンドをいくつか
ショートカットキー効果
ctr + n新規ファイルを開く
ctr + shift + n新規Windowを開く
ctr + shift + t削除したタブの復元
ctr + shift + s名前をつけて保存
tabインデント
tab + shiftアウトデント
ctr + /コメントアウト,アンコメント
また、ショートカットキーは自分自身で設定した内容を割り当てることも可能なため、
よく使う機能に設定されていなかったり、もっと自身に合わせたカスタマイズをすることもできます。

portableモード

便利にカスタマイズしすぎる弊害として、他人のPCで扱う際に不便です。
zipファイルでダウンロードしたVScodeを解凍した後、dataフォルダーを作成することで
設定の読み込みがdataフォルダーを参照するため、USBメモリーなどに入れておけば、
別PCでも自分でカスタマイズしたVScodeを利用することが可能となります。

最後に

自分の好みにカスタマイズすればするほど使いやすくなります。 ただメモを残すだけなら標準のメモ帳で十分ですが、テキストエディタを探しているのなら拡張機能によって汎用性と専門性を兼ね備えるVScodeは非常におすすめです。
小説を書く際にも便利な拡張機能やgitとの対応等、使いやすくあるのですが、使っている拡張機能がプレビュー版だったりと書くには悩む状態でしたので、興味のある方は調べてみてください。
参考サイト
VS Codeでテキストの折り返し
https://atmarkit.itmedia.co.jp/ait/articles/1807/27/news035.html
VSCodeおすすめ設定大公開!!おすすめ拡張機能も
https://qiita.com/papi_tokei/items/c639dc7d1e0f5ad68a74
Visual Studio Code で「保存時に自動整形」「タイプ時に自動整形」を有効にする
https://devadjust.exblog.jp/23791887/
文字化け対策:VSCodeで文字コードを自動判別する設定
https://dianxnao.com/%E6%96%87%E5%AD%97%E5%8C%96%E3%81%91%E5%AF%BE%E7%AD%96%EF%BC%9Avscode%E3%81%A7%E6%96%87%E5%AD%97%E3%82%B3%E3%83%BC%E3%83%89%E3%82%92%E8%87%AA%E5%8B%95%E5%88%A4%E5%88%A5%E3%81%99%E3%82%8B%E8%A8%AD/

Discussion

コメントにはログインが必要です。