Python開発用のVS Codeの環境をまとめておく(2020/4/25時点)

現時点での自分のPython開発用のVS Codeの環境を整理してまとめておく。

目的

• 設定したこと、インストールしたExtensionなどを記録しておくことで、あとで見返せるようにしておく。
• 新しいPCに環境構築する時に再現できるようにしておく。

基本設定

設定編集画面を表示するショートカット

Macの場合は「command + ,」

インデント

• インデントにTabではなくスペースを使用する。

「Editor: Insert Spaces」をチェックする。

• インデント1つに対応する半角スペースの数を設定する。

「Editor: Tab Size」を4に設定する。

自動保存

VS Codeのデフォルトでは自動保存は無効になっている。
「command+s」を手入力だと保存し忘れが多かったので、自動保存を設定した。

• エディターがフォーカスを失ったら自動的に保存するように設定する。

「Files: Auto Save 」を「onFocusChange」に設定する。

Git

• ソースコントロールビューを管理対象のファイルの変更と管理対象外のファイルの変更を分けて表示する。

「Git: Untracked Changes」を「separate」に設定する。

[mixed](デフォルト)

[separate]

非表示にするディレクトリの設定

• 非表示にするディレクトリ(venvで作成されるディレクトリ配下など)を設定する。

「Files: Exclude」に対象のディレクトリを追加する。
※ 必要に応じて適宜追加する。

(例)

 **/env

codeコマンドのパスを通す。

以下のように開発ディレクトリのルートに移動して「code .」を実行するとワークスペースが開けて便利なので、Macのターミナル上でcodeコマンドのパスを通す。

cd /path/to/dev_dir
code .

~/.bash_profileに以下を追記する。

[~/.bash_profile]

PATH="/Applications/Visual Studio Code.app/Contents/Resources/app/bin:${PATH}"

※ VS Codeをインストールしたディレクトリに応じて読み替える。

(公式ドキュメント)
code.visualstudio.com

日本語化のExtension

• Japanese Language Pack for Visual Studio Code (MS-CEINTL.vscode-language-pack-ja)

VS Codeを日本語化する。

Pythonに関するExtension

Python (ms-python.python)

Microsoftが公式に提供しているPython開発用のExtension

Python Docstring Generator (njpwerner.autodocstring)

以下のようにdocstringの雛形を自動生成できる。

生成方法は、docstringを生成したい箇所にカーソルを置いて「command + shift + 2」もしくは、「"""」と入力して「return」

docstringのフォーマットは以下の4種類が選べる。(2020/4/25時点)

• default
• google
• sphinx
• numpy

※ 関数 or クラスのボディが空の状態で生成すると、インデントが効かないバグが存在する。(2020/4/25時点)
Wrong indentation if function body is missing · Issue #117 · NilsJPWerner/autoDocstring · GitHub

コードチェッカー、フォーマッターなど

長くなりそうなので、別記事にします。

Djangoに関するExtension

Djaneiro - Django Snippets (thebarkman.vscode-djaneiro)

VS CodeでDjangoを開発していて、Templateを書いている時に入力補完が効かないのがやや不便だったので、良いExtensionがないか探してみた。

上位のExtensionをいくつか試してみたが、これ以外のExtensionはいずれもDTLの補完入力ができるようになる代わりに、VS Code標準のhtmlの入力補完が効かなくなってしまった。

このExtensionだけが、VS Code標準のhtmlの入力補完を維持したまま、DTLの入力補完機能を追加できたので、これを使うことにする。

ただ、最終コミットが2年前なのが少し気になる。
GitHub - ScottBarkman/vscode-djaneiro: A collection of snippets for django templates, models, views, fields & forms.

Gitに関するExtension

GitLens — Git supercharged (eamodio.gitlens)

カーソルが存在する行の右側に「git blame」の結果相当の情報を出力してくれる。

Git History (donjayamanne.githistory)

ブランチの枝分かれの履歴を視覚的に確認したり、現在のファイルと当時のファイルの差分を表示したりできる。

フォーマッター系のExtension

前提

私はフロントエンドエンジニアではないので、いったん、それっぽくフォーマットできればよいということにする。

HTMLのフォーマット

HTMLのフォーマット機能はVS Codeの標準機能で備わっているので「command + A」→ 「command + K」 → 「commnd + F」でフォーマットできる。

JSONのフォーマット

JSONのフォーマット機能もVS Codeの標準機能で備わっているのでHTMLと同じショートカットでフォーマットできる。

CSScomb (mrmlnc.vscode-csscomb)

CSSはVS Codeの標準機能ではフォーマットできないので、Extensionが必要。

「Prettier」というフォーマッターが有名なようだが、HTMLやJSONのフォーマット機能も備えているため、VS Codeの標準のフォーマッターと競合してしまい、どちらを使うか設定する必要がある。

面倒なので、今回はCSS専用のフォーマッターでかつ有名な「CSScomb」を使用する。

「command + shift + P」 → 「Format styles」でフォーマットできる。

その他

Rainbow CSV (mechatroner.rainbow-csv)

CSVをカラムごとに色分けしてくれる。

indent-rainbow (oderwat.indent-rainbow)

インデントに色を付けてくれる。
インデントがルールに従っていない場合は、赤色で警告してくれる。

PlantUML (jebbs.plantuml)

VS CodeでPlantUMLが使える。

Macにgraphvizのインストールが必要。

brew install graphviz

「option + D」で右側にプレビューを表示できる。

Code Spell Checker (streetsidesoftware.code-spell-checker)

英語のスペルが間違っていると青色のアンダーラインで警告してくれる。
変数名のスペルを間違えた時にすぐに気づくので便利。

Todo Tree (gruntfuggly.todo-tree)

コメントに「TODO」等と書くと、該当ファイルをサイドバーにまとめてリストアップしてくれる。