VisualStudio2015でのTypeScriptの設定

こんにちは。beaglesoftの真鍋です。

VisualStudio2015でTypeScriiptを利用した開発をするときに、環境の設定をどこで行えばいいか確認したので、そのときのメモをまとめます。主にTypeScriptで生成するJavaScriptバージョン指定についての設定になります。

VisualStudio本体の設定

VisualStudioの設定は、全般的に ツール - オプション から行いますが、TypeScriptもこちらから設定できます。

表示されたオプション画面でTypeScriptで検索するとTypeScriptに関するエディタ設定が表示されます。このうち、プロジェクト - 全般 を表示するとコンパイル後のバージョンを設定できます。ただ、この設定は「プロジェクトの一部でないファイルの…」とあるのでプロジェクトで開発するものは対象にならないように思いますが、ちょっと説明がす部見つかりませんでした。

typescript_config1.png (30.8 kB)

プロジェクトの設定

VisualStudioのソースコードはプロジェクト単位で管理されます。これがビルドの単位になっていますね。なので、こちらにも設定があります。プロジェクトファイルを右クリックしてプロパティを表示し、TypeScriptビルドを選択します。ここではプロジェクトをビルドするときのECMAScriptバージョンを設定できます。

typescript_config2.png (31.1 kB)

そのほかモジュールや出力内容なども変更できますね。

Resharperの設定

上記二つの設定を行うことで基本的に問題なく対応したブラウザでTypeScript(JavaScript)が実行できるようになりますが、Resharperを利用している場合には、もう一つ設定が必要です。

VisualStudioのメニューにあるResharper - Options からOptions画面を表示します。この画面でTypeScriptと検索項目に入力するとTypeScriptの設定が表示されます。この中からInspectionsを選択しTypeScript language levelを選択します。

typescript_config3.png (24.0 kB)

この項目ですが、初期設定でAutoDetectionとなっているので、自動で判別してくれるのかと思いきや、画面はエラーハイライトだらけになってしまったので明示的に指定した方がよいように思います。

とりあえず、以上の3つを設定すればTypeScriptで開発をスムーズに進められるので、参考になればと思います。

.NET開発テクノロジ入門2016年版Visual Studio 2015対応版

.NET開発テクノロジ入門2016年版Visual Studio 2015対応版

  • 作者: 五十嵐祐貴,生形可奈子,大田一希,古賀慎一,酒井達明,芝村達郎,田淵義人,日本マイクロソフト株式会社井上章
  • 出版社/メーカー: 日経BP社
  • 発売日: 2016/02/05
  • メディア: 単行本
  • この商品を含むブログを見る