1年くらいRubymineを使っていたんですが、最近vscodeに乗り換えたので設定のメモです。
コードナビゲーション
Rubymineではshiftを2回押してsearch everywhereするか、cmd + Bしてコードジャンプしておけばだいたい良かったんですが、同じようなことをvscodeでやるにはどうすればいいのか結構悩みました。
| やりたいこと | コマンド | ショートカット | カスタマイズ |
|---|---|---|---|
| ファイル名からファイルを開く | Quick Open | cmd + P | |
| コマンドの実行 | Show All Commands | cmd + shift + P | |
| 定義、参照を見る＆ジャンプ | Peek References | shift + F12 | ctrl + ' |
| シンボルからファイルを開く | Open symbol by name | cmd + T | |
| ファイル内のシンボルに移動 | Go to Symbol | cmd + shift + O |
コードジャンプはGo to Definitionやら、Go to Implementationやら、Peek Implementationなどいろいろあるけど、Peek Referencesだけ使ってれば良さそう。Rubyでは効かなかったのでctagsを使う。このあたりの使い勝手はRubymineのほうが快適っぽい。
参照：Code Navigation in Visual Studio Code
Diff
| コマンド |
|---|
| File: Compare Active File With... |
Git関係はSource ControlかGitLensあたりを使う。
その他のショートカット
| やりたいこと | コマンド | ショートカット | カスタマイズ |
|---|---|---|---|
| PROBLEMSを開く/閉じる | View: Toggle Problems | cmd + shift + M | |
| TERMINALを開く/閉じる | View: Toggle Integrated Terminal | ctrl + ` | |
| EXPLORERを開く | View: Show Explorer | cmd + shift + E | |
| SEARCHを開く | View: Show Search | cmd + shift + F | |
| フォーカスをSide Barへ移動 | View: Focus into Side Bar | cmd + ; | |
| フォーカスをEditorへ移動 | View: Focus First Editor Group | cmd + ; |
keybindings.json
[
{
"key": "cmd+;",
"command": "workbench.action.focusSideBar",
"when": "editorTextFocus"
},
{
"key": "cmd+;",
"command": "workbench.action.focusFirstEditorGroup",
"when": "sideBarFocus"
}
]
拡張機能
括弧なのは使ってみたけど結局無効にしたものです。
Ruby
- Ruby - Visual Studio Marketplace
- endwise - Visual Studio Marketplace
-
vscode-ruby-ctags - Visual Studio Marketplace
-
cmd + alt + tでジャンプ - ワークスペースのルートディレクトリがRailsのルートディレクトリでないとうまく動かない
-
- (Ruby on Rails - Visual Studio Marketplace)
- スニペットの補間がうるさかったので外した
- (ruby-rubocop - Visual Studio Marketplace)
- 保存のたびにrubocopで画面が止まってしまうので外した
JavaScript, HTML, CSS
- Auto Rename Tag - Visual Studio Marketplace
- ESLint - Visual Studio Marketplace
- JavaScript (ES6) code snippets - Visual Studio Marketplace
- TSLint - Visual Studio Marketplace
- Flow Language Support - Visual Studio Marketplace
- CSScomb - Visual Studio Marketplace
- (Prettier - Code formatter - Visual Studio Marketplace)
- これなんで無効にしたのか忘れました。多分tslintと同時にprettierをかけるようにしたから必要なくなったとかだと思います
Python
CSV
Git
その他
- Code Runner - Visual Studio Marketplace
-
Code Spell Checker - Visual Studio Marketplace
- vscodeに乗り換えたときにtypoをプッシュしまくったので必須
-
Monokai Pro - Visual Studio Marketplace
- カラーテーマ
- Path Intellisense - Visual Studio Marketplace
- Settings Sync - Visual Studio Marketplace
-
Vim - Visual Studio Marketplace
- Rubymineのvimキーバインドより良くエミュレートできている気がする
- ただ以下のissueがとても困る。ワークアラウンドは効いてると思うけど手元では
ddだけでもジャンプしてしまう
- vscode-icons - Visual Studio Marketplace
- (Bracket Pair Colorizer 2 - Visual Studio Marketplace)
- これとても良いんですが重いので外しました
settings.json
タイトルバーにファイルのフルパスを表示する
settings.json
"window.title": "${activeEditorLong}${separator}${rootName}",
参照：VScode Show Full Path in Title Bar - riow - Medium
workbench関連
settings.json
"workbench.startupEditor": "none",
"workbench.tree.indent": 20,
"workbench.iconTheme": "vscode-icons",
タブの色を変えて見やすくする
settings.json
"workbench.colorCustomizations": {
"tab.activeBorder": "#e34d26",
"tab.activeBackground": "#2d2d2d",
"tab.inactiveBackground": "#1e1f1c",
"tab.unfocusedActiveBorder": "#1f7480"
},
TS Lint関連
settings.json
"editor.formatOnSave": false,
"editor.formatOnPaste": false,
"editor.formatOnType": false,
"editor.codeActionsOnSave": {
"source.fixAll.tslint": true
},
Python関連
settings.json
"python.linting.enabled": true,
"python.linting.pylintEnabled": false,
"python.linting.pep8Enabled": true,
"python.linting.lintOnSave": true,