VSCodeの設定

VSCodeで設定している内容

## 基本設定
```json
// 既定の設定を上書きするには、このファイル内に設定を挿入します
{
    "editor.renderWhitespace": "all",
    "files.associations": { // 拡張子と読み込みタイプの紐づけ
        "*.tpl": "html",
        "*.twig": "html"
    },
    "editor.renderIndentGuides": true,
    "editor.minimap.enabled": true,
    "editor.mouseWheelScrollSensitivity": 5,
    "files.trimTrailingWhitespace": true,
    "php.suggest.basic": false,
    "files.autoGuessEncoding": true,
    "editor.fontSize": 11.5,
    "gitlens.advanced.messages": { // gitlensの設定
        "suppressCommitHasNoPreviousCommitWarning": false,
        "suppressCommitNotFoundWarning": false,
        "suppressFileNotUnderSourceControlWarning": true,
        "suppressGitVersionWarning": false,
        "suppressLineUncommittedWarning": false,
        "suppressNoRepositoryWarning": false,
        "suppressResultsExplorerNotice": true,
        "suppressShowKeyBindingsNotice": true,
        "suppressUpdateNotice": false,
        "suppressWelcomeNotice": true
    },
    "todohighlight.keywords": [ // TODO Highlightの設定
        {
            "text": "TODO",
            "color": "yellow",
            "backgroundColor": "#919191",
        }
    ],
    "gitlens.gitExplorer.files.layout": "auto",
    "window.zoomLevel": 1,
    "gitlens.keymap": "alternate",
    "sync.gist": "***", // Settings Sync の設定
    "sync.lastUpload": "***",
    "sync.autoDownload": false,
    "sync.autoUpload": false,
    "sync.lastDownload": "",
    "sync.forceDownload": false,
    "sync.host": "",
    "sync.pathPrefix": "",
    "sync.quietSync": false,
    "sync.askGistName": false,
    "sync.removeExtensions": true,
    "sync.syncExtensions": true,
    "gitlens.historyExplorer.enabled": true,
    "breadcrumbs.enabled": true,
    "gitlens.views.fileHistory.enabled": true,
    "gitlens.views.lineHistory.enabled": true,
    "workbench.colorTheme": "One Dark Pro",
    "editor.suggestSelection": "first",
    "vsintellicode.modify.editor.suggestSelection": "automaticallyOverrodeDefaultValue",
    "files.exclude": {
        "**/.classpath": true,
        "**/.project": true,
        "**/.settings": true,
        "**/.factorypath": true
    },
    "javascript.updateImportsOnFileMove.enabled": "always",
    "workbench.iconTheme": "vscode-icons"
}
```
## 拡張機能
詳細リンクをクリックすると詳細が見れます。

###[Auto Close Tag](https://marketplace.visualstudio.com/items?itemName=formulahendry.auto-close-tag)
自動でhtmlのタグを閉じたりしてくれる

###[Auto Rename Tag](https://marketplace.visualstudio.com/items?itemName=formulahendry.auto-rename-tag)
htmlの対となるタグを一緒に編集してくれる

###[Auto File Name](https://marketplace.visualstudio.com/items?itemName=JerryHong.autofilename)
requireのときのファイル名を補完してくれる

###[Bookmarks](https://marketplace.visualstudio.com/items?itemName=alefragnani.Bookmarks)
ブックマークの拡張機能

###[Bracket Pair Colorizer](https://marketplace.visualstudio.com/items?itemName=CoenraadS.bracket-pair-colorizer)
対となるカッコを色分けしてくれる

###[Code Runner](https://marketplace.visualstudio.com/items?itemName=formulahendry.code-runner)
コードを実行できる

###[Code Spell Checker](https://marketplace.visualstudio.com/items?itemName=streetsidesoftware.code-spell-checker)
英語のスペルをチェックしてくれる

###[code-eol](https://marketplace.visualstudio.com/items?itemName=sohamkamani.code-eol)
行末（\n,\r\n,\r）を記号表示してくれる

###[Color Info](https://marketplace.visualstudio.com/items?itemName=bierner.color-info)
コード内の色情報を表示してくれる

###[Color Picker](https://marketplace.visualstudio.com/items?itemName=anseki.vscode-color)
そのまんまColor Picker

###[Docker](https://marketplace.visualstudio.com/items?itemName=PeterJausovec.vscode-docker)
Dockerfileを作るのに便利

###[Document This](https://marketplace.visualstudio.com/items?itemName=joelday.docthis)
JSDocを自動入力してくれる（デフォでもあるが、こっちの方が細かく出してくれる）

###[ESLint](https://marketplace.visualstudio.com/items?itemName=dbaeumer.vscode-eslint)
コーディング中にESLintを補完してくれる（違反していると教えてくれる）

###[Git History](https://marketplace.visualstudio.com/items?itemName=donjayamanne.githistory)
git logを見やすく表示してくれる

###[GitLens — Git supercharged](https://marketplace.visualstudio.com/items?itemName=eamodio.gitlens)
git周りの便利ツール

###[Go](https://marketplace.visualstudio.com/items?itemName=ms-vscode.Go)
Goの補完

###[HTML CSS Support](https://marketplace.visualstudio.com/items?itemName=ecmel.vscode-html-css)
名前の通り

###[HTML Snippets](https://marketplace.visualstudio.com/items?itemName=abusaidm.html-snippets)
名前の通り

###[IntelliSense for CSS class names in HTML](https://marketplace.visualstudio.com/items?itemName=Zignd.html-css-class-completion)
htmlのclassやidの補完

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

###[JavaScript (ES6) code snippets](https://marketplace.visualstudio.com/items?itemName=xabikos.JavaScriptSnippets)
名前の通り

###[jumpy](https://marketplace.visualstudio.com/items?itemName=wmaurer.vscode-jumpy)
vim jump的な

###[Live Share](https://marketplace.visualstudio.com/items?itemName=MS-vsliveshare.vsliveshare)
画面の共有

###[One Dark Pro](https://marketplace.visualstudio.com/items?itemName=zhuangtongfa.Material-theme)
好きなテーマ

###[Partial Diff](https://marketplace.visualstudio.com/items?itemName=ryu1kn.partial-diff)
部分diffができる

###[PHP Debug](https://marketplace.visualstudio.com/items?itemName=felixfbecker.php-debug)
名前の通り

###[PHP DocBlocker](https://marketplace.visualstudio.com/items?itemName=neilbrayfield.php-docblocker)
PHP Doc周りの補完

###[PHP Intelephense](https://marketplace.visualstudio.com/items?itemName=bmewburn.vscode-intelephense-client)
PHP IntelliSenseより好き

###[PlantUML](https://marketplace.visualstudio.com/items?itemName=jebbs.plantuml)
PlantUMLをググって（設計図を書く）

###[Project Manager](https://marketplace.visualstudio.com/items?itemName=alefragnani.project-manager)
名前の通り

###[Python](https://marketplace.visualstudio.com/items?itemName=ms-python.python)
Pythonの補完

###[Rainbow CSV](https://marketplace.visualstudio.com/items?itemName=mechatroner.rainbow-csv)
CSVを色分け＆SQLが使える

###[Regex Previewer](https://marketplace.visualstudio.com/items?itemName=chrmarti.regex)
正規表現を確認できる

###[Relative Path](https://marketplace.visualstudio.com/items?itemName=jakob101.RelativePath)
パスの補完

###[Settings Sync](https://marketplace.visualstudio.com/items?itemName=Shan.code-settings-sync)
設定の共有

###[shunt](https://marketplace.visualstudio.com/items?itemName=mycelo.shunt)
複数行を一括で編集したいときによく使う

###[SQL Server (mssql)](https://marketplace.visualstudio.com/items?itemName=ms-mssql.mssql)
SQLの補完

###[TODO Highlight](https://marketplace.visualstudio.com/items?itemName=wayou.vscode-todo-highlight)
TODOを目立たせる
設定は上記の基本設定に記載

###[Visual Studio IntelliCode](https://marketplace.visualstudio.com/items?itemName=VisualStudioExptTeam.vscodeintellicode)
VSCodeの補完プラグイン

###[vscode-icons](https://marketplace.visualstudio.com/items?itemName=vscode-icons-team.vscode-icons)
好きなアイコンテーマ

###[Whitespace+](https://marketplace.visualstudio.com/items?itemName=davidhouchin.whitespace-plus)
スペースの色付け
<details>
<summary>自分の設定</summary>
<pre>
<code>
{
    "mode": "all",
    "autoStart": true,
    "refreshRate": 100,
    "elements":
    [{
        "name": "space",
        "enabled": true,
        "pattern": " {2,}", //2文字以上のスペースは色を付ける
        "style": {
            "borderWidth": "1px",
            "borderRadius": "2px",
            "borderStyle": "solid",
            "light": {
                "backgroundColor": "rgba(58, 70, 101, 0.3)",
                "borderColor": "rgba(58, 70, 101, 0.4)"
            },
            "dark": {
                "backgroundColor": "rgba(117, 141, 203, 0.3)",
                "borderColor": "rgba(117, 141, 203, 0.4)"
            }
        }
    },{
        "name": "tab",
        "enabled": true,
        "pattern": "\\t",
        "style": {
            "borderWidth": "1px",
            "borderRadius": "2px",
            "borderStyle": "solid",
            "light": {
                "backgroundColor": "rgba(170, 53, 53, 0.3)",
                "borderColor": "rgba(170, 53, 53, 0.4)"
            },
            "dark": {
                "backgroundColor": "rgba(223, 97, 97, 0.3)",
                "borderColor": "rgba(223, 97, 97, 0.4)"
            }
        }
    },{
        "name": "newline",
        "enabled": false,
        "pattern": "\\n",
        "style": {
            "borderWidth": "1px",
            "borderRadius": "2px",
            "borderStyle": "solid",
            "light": {
                "borderColor": "rgba(38, 150, 38, 0.3)"
            },
            "dark": {
                "borderColor": "rgba(85, 215, 85, 0.4)"
            }
        }
    },{
        "name": "trailing",
        "enabled": "unlessCursorAtEndOfPattern",
        "pattern": "\\s+$",
        "style": {
            "borderWidth": "1px",
            "borderRadius": "2px",
            "borderStyle": "solid",
            "light": {
                "backgroundColor": "rgba(58, 70, 101, 0.3)",
                "borderColor": "rgba(58, 70, 101, 0.4)"
            },
            "dark": {
                "backgroundColor": "rgba(117, 141, 203, 0.3)",
                "borderColor": "rgba(117, 141, 203, 0.4)"
            }
        }
    }]
}
</code>
</pre>
</details>

###[XML Tools](https://marketplace.visualstudio.com/items?itemName=DotJoshJohnson.xml)
XMLの補完

###[YAML](https://marketplace.visualstudio.com/items?itemName=redhat.vscode-yaml)
YAMLの補完

###[zenkaku](https://marketplace.visualstudio.com/items?itemName=mosapride.zenkaku)
全角スペースの色つけ