VSCodeが格段に使いやすくなる、おすすめ拡張機能
私が使っている VSCode のおすすめ拡張機能をまとめました。プログラミングやコーディングの効率を高めたいときに便利なもの。
Sponsored Link
Swift 開発環境
Swift 開発用のエディタにする。
色付けやスニペット補完。
VS CodeVim
Vim 化させる拡張機能。Atom や VSCode など次々と新しいエディタが出てきてショートカットキーを覚えるのが億劫な人は、Vim化する拡張機能を入れて Vim のキーバインドを使うようにすれば、新しいエディタのキーバインドに振り回されることはなくなるでしょう。素早く打てるようにエスケープは jj に設定しておくとよし。
"vim.insertModeKeyBindings": [
// vim モード：jj でエスケープする
{
"before": ["j", "j"],
"after": ["<Esc>"]
}
],
"vim.normalModeKeyBindingsNonRecursive": [
// vim モード：j を gj に変更
{
"before": ["j"],
"after": ["g", "j"]
}
],
Settings Sync
エディター設定を共有する。プラグイン設定の「Generate New Token」をクリックすると New personal access token のページに移動するので、Generate token のボタンを押して作成。番号をコピーして、コマンドパレットで sync upload を押して番号を入力。
"sync.gist": "tokenの番号", // 設定の同期 "sync.autoUpload": true, // 設定を変更したときに設定を自動アップロードする "sync.autoDownload": true, // エディターを開いたときに設定を自動ダウンロードする
Prettier
マークダウンにも対応している高速なコードフォーマット拡張機能。保存時にフォーマットすることができる。もちろん、フォーマットしたくない言語も指定できる。
// Set the default
"editor.formatOnSave": false,
// Enable per-language
"": {
"editor.formatOnSave": true
}
Easy Sass
sass を自動コンパイル。フォーマットはコンパイルを圧縮するcompressedに設定して軽量化しましょう。
"easysass.formats": [
// sass コンパイルを圧縮に
{
"format": "compressed",
"extension": ".css"
}
],
PrintCode
コードを印刷する。スタイルは崩れてしまうので、綺麗に印刷したい人は PDF に変換して印刷しましょう。
Markdown PDF
Markdown をPDFに変換する。
Debugger for Chrome
JavaScript をChromeでデバッグ。
Terminal
エディター上でターミナルを扱う。
Paste Image
クリップボードにコピーした画像やスクリーンキャプチャをペーストする。
Material Icon Theme
フォルダ・ファイルにマテリアルデザインのアイコンが表示される。vscode-icons よりこちらが好み。
Todo +
todo リストを管理。
Atom Keymap configuration
Atom のキーマップ。Atom から乗り換えたい人はこれを入れるといい。
vscode-htmltagwrap
タグで囲む。
colorize
カラーコードに色を表示。
Sass
SASS コンパイル。
SFTP
ファイル転送。sftp.json に設定を記述して使う。これがあれば FTP クライアントはいらない。
Project Manager
プロジェクト管理。
Slack
メッセージやファイルを Slack に送信する。
ビジュアルエディター
VS Code をビジュアルエディターに変える拡張機能。私は使ってませんが、ビジュアルエディターにしたい人は入れるとよいでしょう。
スポンサード リンク
-
投稿者：commte
株式会社コムテ代表取締役。2015/8：弊社にてWeb制作スクールを開始。 WebDesign + Web制作 (最新情報 配信)。おっとりした話し方をするおっさん。
URL：西田 鉄平
この後によく読まれている記事
Comments
このサイトはスパムを低減するために Akismet を使っています。コメントデータの処理方法の詳細はこちらをご覧ください。
Leave a Comment