Build2015でElectron + MonacoをベースとしたVisual Studio Codeが発表されました.
.NET Coreのオープンソース化やマルチプラットフォーム化に伴って, 以前から存在したOmniSharpが度々紹介されてきましたが,
とうとう純正の開発環境が登場しました.
ということで早速試してみました.
ちなみにVisual Studio Codeのインストーラは, ここからダウンロードできます.
Windowsの場合は, ダウンロードしたファイルを開くと自動でインストールして起動までしてくれます.
起動してファイルを開いてみるとこんな感じです.
Visual Studio Codeが入ったら, とりあえずシンタックスハイライトだけは, してくれます.
ですが, vscは, IDEというわけでは, ないので, それらの機能は, 個別で導入します.
公式サイトには,
- ASP.NET
- Node.js
- git
- Yeoman
- hottowel
- Express
- gulp
- mocha
- bower
- TypeScript
- TypeScript definition manager
を入れておくといい感じ, みたいに書いてあるので, これらを入れます.
ついでにgrunt-cliも入れます.
gruntがないと, パッケージのリストアのタイミングで怒られます.
これらのインストールについては, 今回は, 割愛します.
結論から先に述べるとVisual Studio Expressしか使えないような劣悪な環境に身を置く人は, テンプレートの生成などだけをExpressにさせて
コーディングは, Codeを使うほうが, 参照の追跡などの機能がCodeのほうが強いので, 乗り換えたほうがいいかもしれません.
それほど完成度の高いエディタと言えます.
vscでASP.NET開発を行う場合, 全部一から手書きをしてもいいのですが, さすがにそれはめんどくさいので, 先ほど入れたYeomanを使ってテンプレートを生成します.
コマンドラインで,
yo aspnet
と入れると, Yeomanが実行されて, どのテンプレートを生成するか聞かれます.
現在のデフォルトでは,
- Empty Application
- Console Aplication
- Web Application
- Web API Application
- Nancy ASP.NET Application
- Class Library
が選択できます.
これらのどれかをカーソルキーで選択してEnterを押すと, プロジェクト名をどうするか聞かれるので, 適当な名前を付けてEnterを押します.
そうすると, その場にその名前のプロジェクトが生成されます.
ちなみに, デバッグは, NodeとMonoに現在対応しているので, Windows環境の人は, おとなしくVS2015を使いましょう.
デバッグは, Visual Studio同様にF5で実行できるようです.
Codeでは, デバッグ設定も自前でlaunch.jsonというファイルに書いて行う風なのですが, 最初にF5を押すといい感じのNode用のひな形を作ってくれるので
それを参考に書いていくといいかと思います.
ちなみに以下のjsonがlaunch.jsonのひな形です.
{
"version": "0.1.0",
// List of configurations. Add new configurations or edit existing ones.
// ONLY "node" and "mono" are supported, change "type" to switch.
"configurations": [
{
// Name of configuration; appears in the launch configuration drop down menu.
"name": "Launch app.js",
// Type of configuration. Possible values: "node", "mono".
"type": "node",
// Workspace relative or absolute path to the program.
"program": "app.js",
// Automatically stop program after launch.
"stopOnEntry": true,
// Command line arguments passed to the program.
"args": [],
// Workspace relative or absolute path to the working directory of the program being debugged. Default is the current workspace.
"cwd": ".",
// Workspace relative or absolute path to the runtime executable to be used. Default is the runtime executable on the PATH.
"runtimeExecutable": null,
// Environment variables passed to the program.
"env": { }
},
{
"name": "Attach",
"type": "node",
// TCP/IP address. Default is "localhost".
"address": "localhost",
// Port to attach to.
"port": 5858
}
]
}
ほかの細かい操作(リストアとか単純なdnx webのような実行)は, コマンドパレットから実行します.
ctrl + shift + pで通常のatomのようにコマンドパレットが呼び出されるので, あとは, そこに動かしたいコマンドを流し込むとコマンドラインが立ち上がって実行してくれます.
たとえばdnx webのようなコマンドは, web, kestrealなどの何となくみんな使っていそうなものを決め打ちしているわけではなく, project.jsonに
コマンドを追加すれば, すぐにコマンドパレットンに反映されて呼び出すことが可能です.
コマンドパレットでdnx webを実行すると, すぐに実行されます.
エディタもなかなか優秀です.
たとえば, 使ってないusingは, しっかりハイライトしてくれたりといった基本的なVisual Studioのエディタ機能は, 備えています.
メソッドやクラスの上についているreferenceを選択すると, Express以外では, 実行できるその場に参照を表示する機能も呼び出せます.
コマンドでこれらを呼び出したい場合は, 定義を参照したいものを選択したうえで, ctrl + F12で定義にジャンプ, Shift + F12で定義をその場に表示ができます.b
もちろん普通にIntelliSenseも動きます.
ファイルを追加したい場合は, Yoemanを使用してささっとテンプレートを生成します.
Yoemanは, 基本的に
yo Generatorの名前 ファイルパス
でファイルを生成します.
ASP.NETのgeneratorは,
- aspnet:MvcController
- aspnet:MvcView
- aspnet:WebApiController
- aspnet:Class
- aspnet: StartupClass
- aspnet: BowerJson
- aspnet: CoffeeScript
- aspnet: Config
- aspnet: gitignore
- aspnet: HTMLPage
- aspnet: JavaScript
- aspnet: JScript
- aspnet: JSON
- aspnet: PackageJson
- aspnet: TextFile
- aspnet: TypeScript
が生成できます.
これを実行すると, いい感じのテンプレートファイルを吐き出してくれるので, 開発がぐっと楽になります.
とりあえず簡単にパッケージの導入, テンプレートの作成, プロジェクトの実行までやってみて, かなりすぐにさくっと始められる手軽さ,
Visual StudioのExpressよりは, 圧倒的に使いやすいエディタ, 起動の速さなど, Mac, LinuxなどのIDEがない状況での開発においては, かなり
快適に開発ができるようになるのではないかと思います.
また何かあったらまとめてみます.
