Works by

Ren's blog

@rennnosuke_rk 技術ブログです

はじめてのVSCode環境構築メモ

エディタを乗り換えよう

今までatomを雑に使っていたのですが、

などの理由から、新しくVSCodeに乗り換えてみました。

今回の記事は、自分用のVSCode乗り換え時のセットアップメモになります。
適宜更新していくかもしれません。

VSCodeとは

code.visualstudio.com

かのMicrosoftがリリースした高機能な軽量エディタです。
VSCodeが出た当初はその性能に対して懐疑的でしたが、蓋を開けてみるとatomにも引けを取らない高機能エディタでした。
周りの人も次々とVSCodeに乗り換えています。

VSCodeのセットアップ

環境は MacOS X High Sierraです。

起動コマンドインストール

shellコマンドでVSCodeを起動できるようになります。

Command + Shift + pでコマンドパレットを起動し、"shell command"と入力。
「シェルコマンド:PATH内に'code'コマンドをインストールします」を選択。

f:id:rennnosukesann:20180602164859p:plain

Vim

VSCodeVimキーバインドを導入。
Vimキーバインドでエディタを扱う人用。

拡張機能」-> 検索欄に「vim」->「vscodevim」

f:id:rennnosukesann:20180602150353p:plain

こちらの記事がすごく参考になります↓

割と突き詰めてやったvim->vscode移行

Tabキーでスペースorタブ

タブ派の方はここでfalse。

f:id:rennnosukesann:20180602151043p:plain

files.encoding = utf-8

「Code」->「基本設定」->「設定」

f:id:rennnosukesann:20180602150141p:plain

コード整形

保存時・ペースト・エディター入力時にコードを自動整形するかどうか設定できます。

「Code」->「基本設定」->「設定」-> 検索で「formatOn」

f:id:rennnosukesann:20180602153754p:plain

f:id:rennnosukesann:20180602153955p:plain

ファイル表示無効

デフォルトだと、ファイルを開くとファイル名がイタリック表記になります。
<Ctrl-s>などで確定状態にしないままの状態で新しくファイルを開くと、イタリック表記だったファイルは閉じてしまいます。

この設定が嫌だったので、設定に"workbench.editor.enablePreview": falseを追加しました。

qiita.com

Short Cut

ファイル検索

Ctrl + p

f:id:rennnosukesann:20180602152542p:plain

Commandを押しながらEnterすると別ウィンドウで開きます。

ターミナル起動

control+

f:id:rennnosukesann:20180602152628p:plain

使い始めての感想

  • atomよりもサクサク動作する
  • IDEでないにもかかわらず、補完が強力
    • デフォルトでも十分気持ち良く補完できる(js)
  • 設定が楽
  • デフォルトでも十分機能が充実している

参考

code.visualstudio.com

割と突き詰めてやったvim->vscode移行

VSCodeで爆速コーディング環境を構築する(主にReactJS向け設定)