Help us understand the problem. What is going on with this article?

Visual Studio 設定メモ

More than 1 year has passed since last update.

はじめに

vscodeとは

以下のサイトを参照のこと。

プラグインのインストール方法

以下のサイトを参照のこと。

プラグインの設定方法

プラグインの設定は、ユーザ、ワークスペース及びフォルダーの3段階で設定できる。

  1. ユーザ設定
    ~/.config/Code/User/settings.json
  2. ワークスペース設定
    this_is_workspace/default.code-workspace
  3. フォルダー設定
    this_is_folder/.vscode/settings.json

設定値は上から順番に上書き適用される。

一般

アイコン

エクスプローラーで可愛いアイコンが見れる拡張機能。
インストールすれば勝手に機能する。設定はほぼ不要。

  • vscode-icons vscode-icons-team.vscode-icons

TODOリスト

コード上のTODOとかFIXMEとかの文言を検知してタスクリストにまとめてくれる拡張機能。
デフォルト設定でもそれなりにつかえる。

  • Todo Tree gruntfuggly.todo-tree

設定の同期

設定値をGist経由で複数端末に同期できる。

  • Settings Sync shan.code-settings-sync

言語

Japanese

言わずとしれた日本語化パック。さすがMSは芸が細かい。

  • Japanese Language Pack for Visual Studio Code ms-ceintl.vscode-language-pack-ja

English

コード上の英語のスペルをチェックしてくれる。日本語は無理。

  • Code Spell Checker streetsidesoftware.code-spell-checker

MarkDown

MarkDownファイルのプレビュー等の複数の便利機能を兼ね備えた拡張機能。

  • MarkDown yzhang.markdown-all-in-one

PlantUML

PlantUML のプレビューや画像エクスポート等の機能を持つ拡張機能。

  1. Graphviz からOSに対応したパッケージをダウンロードする。
  2. ダウンロードした圧縮ファイルを ~/.vscode/dropins/graphviz に展開する。
  3. 環境変数Pathに~/.vscode/dropins/graphviz/binを追加する。
  4. PlantUML jebbs.plantuml をインストールする。

YAML

YMLの言語設定。設定はほぼ不要。

  • YAML redhat.vscode-yaml

Java

  1. OpenJDK からOSと所望バージョンに適したJDKをダウンロードする。
  2. ダウンロードした圧縮ファイルを ~/.vscode/dropins/java に展開する。
  3. 以下の拡張機能をインストールする。Javaの言語パックであるJava Extension Packをインストールすると6個のパッケージが自動的にインストールされる。
    1. Java Extension Pack vscjava.vscode-java-pack
      1. Language Support for Java(TM) by Red Hat redhat.java
      2. Debugger for Java vscjava.vscode-java-debug
      3. Java Test Runner vscjava.vscode-java-test
      4. Maven Project Explorer ``
      5. Java Dependency Viewer vscjava.vscode-java-dependency
      6. Visual Studio IntelliCode visualstudioexptteam.vscodeintellicode

Maven ユーザは更に以下をインストールする。

  1. Apache Maven から Binary zip archiveをダウンロードする。
  2. ダウンロードした圧縮ファイルを ~/.vscode/dropins/maven に展開する。
  3. 以下のプラグインをインストールする。
    1. Maven for Java vscjava.vscode-maven
  4. ユーザ設定のmaven.executable.path~/.vscode/dropins/maven/bin/mvnに相当する「絶対パス」を設定する。

Python

Pythonの言語設定。設定はほぼ不要。

  1. PythonWinPython から パッケージをダウンロードする。
  2. ダウンロードした圧縮ファイルを ~/.vscode/dropins/python に展開する。
  3. 以下のプラグインをインストールする。
    1. Python ms-python.python
  4. ユーザ設定のpython.pythonPath~/.vscode/dropins/python/pythonに相当する「絶対パス」を設定する。

JavaScript

以下の拡張機能をインストールする。

  • Color Hightlight naumovs.color-highlight
  • Debugger for Chrome msjsdiag.debugger-for-chrome
  • Beautify hookyqr.beautify

nodeを使う場合は以下もインストールする。

  1. node.js からパッケージをダウンロードする。
  2. ダウンロードした圧縮ファイルを ~/.vscode/dropins/node に展開する。
  3. 以下のプラグインをインストールする。
    1. npm eg2.vscode-npm-script
    2. ESLint dbaeumer.vscode-eslint
  4. 環境変数Pathに~/.vscode/dropins/node/binを追加する。

Docker

Dockerの操作やDockerfileの言語拡張の機能をまとめたパッケージ。

  • ms-azuretools.vscode-docker

構成管理

git

gitの拡張機能。以下の手順でインストールする。

  1. git からパッケージをダウンロードする。
  2. ダウンロードした圧縮ファイルを ~/.vscode/dropins/git に展開する。
  3. 以下のプラグインをインストールする。
    1. GitLens eamodio.gitlens
    2. Git Graph mhutchie.git-graph
  4. 環境変数Pathに~/.vscode/dropins/git/binを追加する。

svn

svnの拡張機能。以下の手順でインストールする。

  1. VisualSVN から Apache Subversion command line toolsをダウンロードする。
  2. ダウンロードした圧縮ファイルを ~/.vscode/dropins/svn に展開する。
  3. 以下のプラグインをインストールする。
    1. SVN johnstoncode.svn-scm
  4. ユーザ設定のsvn.path~/.vscode/dropins/svn/bin/svnに相当する「絶対パス」を設定する。
kannkyo
Full stack software engineer. UX Design, frontend, backend and infrastructures etc...
https://kannkyo.hatenablog.com/about
Why not register and get more from Qiita?
  1. We will deliver articles that match you
    By following users and tags, you can catch up information on technical fields that you are interested in as a whole
  2. you can read useful information later efficiently
    By "stocking" the articles you like, you can search right away