VSCode まいせってぃんぐ

```VSCode``` 初期インストール後からやること色々

# 日本語化

## [Japanese Language Pack for Visual Studio Code](https://marketplace.visualstudio.com/items?itemName=MS-CEINTL.vscode-language-pack-ja)

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/259373/cc04cdba-f00a-484a-5c59-0e2a1944fff3.png)

インストールしたら再起動を促されるので即従った方が良い

# 配色・見た目設定

配色・テーマに関してはお好みで。以下から探すと良い。
[Visual Studio Codeで見やすいテーマファイルのまとめ](https://coliss.com/articles/build-websites/operation/work/best-of-visual-studio-code-themes.html)

## [Dark+Material](https://marketplace.visualstudio.com/items?itemName=vangware.dark-plus-material)
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/259373/f23af4b6-d603-ff52-e8f8-5f23cf516163.png)

私はコメント行が明るく見やすいものが欲しかったのでチョイス。
インストールすると、画面上部にすぐテーマ設定を促す表示が出るので選択すれば反映される。

## [Ayu](https://marketplace.visualstudio.com/items?itemName=teabyii.ayu)

ホワイトベース。気分で切り替えて使う。

## テーマの切り替え方

複数のテーマをインストールしている場合は以下の方法で切り替える。

拡張機能一覧を表示(左メニューから選択か、``Ctrl + Shift + X``を押下)
切り替え先のテーマパッケージを選択
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/259373/d456c3bd-c7ea-77be-9187-14c086159049.png)

「配色テーマを設定」を押下
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/259373/e516cc12-904a-fc44-dcad-a305e4360f0f.png)

上部にテーマ一覧が表示されるのでクリックして選択(1種しかない場合でも選択が必要)
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/259373/66f31f5b-ecb1-02dd-3b07-61e5c1378fdf.png)

# 開発サポート

## スペルチェック：[Code Spell Checker](https://marketplace.visualstudio.com/items?itemName=streetsidesoftware.code-spell-checker)

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/259373/7f73abac-7e23-c0cb-5efe-789874abdac8.png)

- 辞書にない単語があると波線が付く。
- 正しい入力なら右クリックから辞書登録が可能。
- 辞書登録はユーザ設定、ワークスペース、フォルダ単位で設定できる
- フォルダ単位で設定してGit管理すると他の人と共有できる？(``.vs``配下だった気がするから普通Gitに登録しない)

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/259373/7a592b95-050c-a6ce-4209-ee743004a2a8.png)

- ``Info``レベルで検知されるので、クリックして一括で確認すると良い

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/259373/f30e5563-4ca7-ac7a-7dc0-0e7303ef2de4.png)

## エラー情報表示：[Error Lens](https://marketplace.visualstudio.com/items?itemName=usernamehw.errorlens)

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/259373/c2f2d925-e1d9-0cdb-0bda-631f3baa67c9.png)

あるとエディタにエラー情報を文章で表示してくれる

## インデント表示：[indent-rainbow](https://marketplace.visualstudio.com/items?itemName=oderwat.indent-rainbow)

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/259373/e9cab4c0-f604-0672-0a76-4c22132b0bbc.png)

- インデントが虹色に色分け表示される。
- ベタ塗りと線だけの2種類ある

## 末尾スペース削除：[Trailing Spaces](https://marketplace.visualstudio.com/items?itemName=shardulm94.trailing-spaces)

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/259373/c8f8287a-15b9-af7c-736a-31adf5f52146.png)

- 末尾に不要スペースがあると色を付けて教えてくれる。

## 未保存ファイル表示：[Unsaved Files](https://marketplace.visualstudio.com/items?itemName=wraith13.unsaved-files-vscode)

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/259373/7dd08e8d-b4a4-bca2-784c-402cd60e026d.png)

## 全角スペース表示：[Zenkaku](https://marketplace.visualstudio.com/items?itemName=mosapride.zenkaku)

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/259373/9b5a02fe-ca9a-2464-0875-ce49d8988673.png)

- 全角スペース絶対許さないマン

## Python DocString充実化：[autoDocstring: VSCode Python Docstring Generator](https://marketplace.visualstudio.com/items?itemName=njpwerner.autodocstring)

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/259373/a60f6ec5-4237-0e78-d062-4569f85af263.png)

- まだ``DocString``のこと良くわかってないけど一応

# Markdown設定

以下、未整理(更新前の書き方のまま)。

1. 「Ctrl+Shift+X」で拡張機能を表示
1. 「Markdown All in One」をインストール(画像1枚目)
1. 「Markdown Preview Enhanced」をインストール(画像2枚目)
1. 「Markdown PDF」をインストール(画像3枚目)
1. 「Paste Image」をインストール(画像4枚目)
1. 「Ctrl + ,」でユーザ設定を開く
1. 「Paste Image」で検索して見つかる「Paste Image: Path」を ``${currentFileDir}`` から ``${currentFileDir}\images`` に編集する(画像5枚目) ※よく似た名前の「Paste Image: Baes Path」ではないので注意

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/259373/68d62eb9-2239-f7ca-59e7-36b4842d49da.png)

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/259373/55280442-d780-626a-7412-393f4accfbf6.png)

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/259373/532f2517-9744-d966-5c24-4b01cf6f83b7.png)

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/259373/6c6f4c98-3e34-bf39-f855-1507274dc10a.png)

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/259373/8f0b3744-3d1b-ba90-d36a-6fd4dc850848.png)