きよくらの備忘録

「三日坊主と呼ばせない!日記」改め。主にソフトウェア開発関連の話題。

クラスライブラリ・プロジェクトでTypeScriptのコンパイルを行うようにする設定

Visual Studio 2013にて、クラスライブラリ・プロジェクトに追加したTypeScriptファイルを、ファイル保存時やビルド時にコンパイルするために必要な設定についてのメモ。

f:id:kiyokura:20150204230511p:plain

 

クラスライブラリ・プロジェクトの場合、そのままではTypeScriptファイルを追加してもコンパイルを行ってくれません*1*2。保存時やプロジェクトのビルド時にTypeScriptもコンパイルするには、プロジェクトファイルを編集する等の対応が必要になります*3

 

プロジェクトファイル(*.csproj)の編集箇所

プロパティーのImportを追記

該当のクラスライブラリプロジェクトのプロジェクトファイル(例:SampleClassLib.csproj)のProject要素の直下に、以下のImportを追加します。

<Import Project="$(MSBuildExtensionsPath32)\Microsoft\VisualStudio\v$(VisualStudioVersion)\TypeScript\Microsoft.TypeScript.Default.props" />

 

2.最初のPropertyGroupにTypeScriptToolsVersionを追記

最初に出てくる<PropertyGroup>配下に、以下のように<TypeScriptToolsVersion>を追加します。

<TypeScriptToolsVersion>1.0</TypeScriptToolsVersion>

※TypeScript 1.4をインストールしている場合は1.0 → 1.4になります。

 

3.ビルドターゲットのインポートを追記

以下のビルドターゲットに関する記述を追加します。C#のビルドターゲットの直後くらいに追加すればよいと思います。

<Import Project="$(MSBuildExtensionsPath32)\Microsoft\VisualStudio\v$(VisualStudioVersion)\TypeScript\Microsoft.TypeScript.targets" Condition="Exists('$(MSBuildExtensionsPath32)\Microsoft\VisualStudio\v$(VisualStudioVersion)\TypeScript\Microsoft.TypeScript.targets')" />

以上で完了です。

 

設定完了

上記を追加した後、プロジェクトを再読み込みすると、ビルド時のコンパイル及びセーブ時のコンパイルが行われるようになっているはずです。また、プロジェクトのプロパティを開くと以下のように『TypeScriptビルド』のタブが出ていて、コンパイルのパラメータ設定も可能となっています。

f:id:kiyokura:20150204230619p:plain

 

参考:*.csprojファイルの全文

参考までに、サンプルプロジェクトのcsprojの全文を張っておきます。

<?xml version="1.0" encoding="utf-8"?>
<Project ToolsVersion="12.0" DefaultTargets="Build" xmlns="http://schemas.microsoft.com/developer/msbuild/2003">
  <Import Project="$(MSBuildExtensionsPath32)\Microsoft\VisualStudio\v$(VisualStudioVersion)\TypeScript\Microsoft.TypeScript.Default.props" />
  <Import Project="$(MSBuildExtensionsPath)\$(MSBuildToolsVersion)\Microsoft.Common.props" Condition="Exists('$(MSBuildExtensionsPath)\$(MSBuildToolsVersion)\Microsoft.Common.props')" />
  <PropertyGroup>
    <Configuration Condition=" '$(Configuration)' == '' ">Debug</Configuration>
    <Platform Condition=" '$(Platform)' == '' ">AnyCPU</Platform>
    <ProjectGuid>{09402709-2BBA-4BF6-9807-E1B870C5E069}</ProjectGuid>
    <OutputType>Library</OutputType>
    <AppDesignerFolder>Properties</AppDesignerFolder>
    <RootNamespace>SampleClassLib</RootNamespace>
    <AssemblyName>SampleClassLib</AssemblyName>
    <TargetFrameworkVersion>v4.5.1</TargetFrameworkVersion>
    <FileAlignment>512</FileAlignment>
    <TypeScriptToolsVersion>1.0</TypeScriptToolsVersion>
  </PropertyGroup>
  <PropertyGroup Condition=" '$(Configuration)|$(Platform)' == 'Debug|AnyCPU' ">
    <DebugSymbols>true</DebugSymbols>
    <DebugType>full</DebugType>
    <Optimize>false</Optimize>
    <OutputPath>bin\Debug\</OutputPath>
    <DefineConstants>DEBUG;TRACE</DefineConstants>
    <ErrorReport>prompt</ErrorReport>
    <WarningLevel>4</WarningLevel>
  </PropertyGroup>
  <PropertyGroup Condition=" '$(Configuration)|$(Platform)' == 'Release|AnyCPU' ">
    <DebugType>pdbonly</DebugType>
    <Optimize>true</Optimize>
    <OutputPath>bin\Release\</OutputPath>
    <DefineConstants>TRACE</DefineConstants>
    <ErrorReport>prompt</ErrorReport>
    <WarningLevel>4</WarningLevel>
  </PropertyGroup>
  <ItemGroup>
    <Reference Include="System" />
    <Reference Include="System.Core" />
    <Reference Include="System.Xml.Linq" />
    <Reference Include="System.Data.DataSetExtensions" />
    <Reference Include="Microsoft.CSharp" />
    <Reference Include="System.Data" />
    <Reference Include="System.Xml" />
  </ItemGroup>
  <ItemGroup>
    <Compile Include="Class1.cs" />
    <Compile Include="Properties\AssemblyInfo.cs" />
  </ItemGroup>
  <ItemGroup>
    <TypeScriptCompile Include="file1.ts" />
  </ItemGroup>
  <Import Project="$(MSBuildToolsPath)\Microsoft.CSharp.targets" />
  <Import Project="$(MSBuildExtensionsPath32)\Microsoft\VisualStudio\v$(VisualStudioVersion)\TypeScript\Microsoft.TypeScript.targets" Condition="Exists('$(MSBuildExtensionsPath32)\Microsoft\VisualStudio\v$(VisualStudioVersion)\TypeScript\Microsoft.TypeScript.targets')" />
  <!-- To modify your build process, add your task inside one of the targets below and uncomment it.
       Other similar extension points exist, see Microsoft.Common.targets.
  <Target Name="BeforeBuild">
  </Target>
  <Target Name="AfterBuild">
  </Target>
  -->
</Project>

*1:もちろんコマンドラインからtscを叩けばコンパイルしてくれます

*2:TypeScriptプロジェクトやWeb系のプロジェクトの場合は、最初からorファイルを追加した時点で自動的にコンパイルなどが有効になります

*3:そもそもクラスライブラリ・プロジェクトでTSのコンパイルするシチュエーションというのがアレかもしれませんが、まあ、そういうこともあるということで