ASP.NET Core の SPA の Template が動かない（dist のフォルダーが作られない）

事象の再現方法は、

ASP.NET Core の SPA の Tempates から Angular のプロジェクトを作成(ここでは正常に動きます）
GitHubやVSTSにPushする。
（別の人が）リモートからクローンしたソースをデバッグでエラーが出て動かない

というものです。

ちなみに.NET Core 1.1で作った際の事象です。Preview 版で出てる2系ではGitHubのコードを見る限り修正済みになってました♪

一応 SPA の Templates を使ったプロジェクトについてはこちらに… beachside.hatenablog.com

エラーの内容は…

Exception: Call to Node module failed with error: Error: Cannot find module ‘./wwwroot/dist/vendor-manifest.json’

エラーに書いてるままの事象ですが、原因はプロジェクトの

wwwroot > dist のディレクトリがない（作られない）
で、ついでに ClientApp > dist のディレクトリもない（作られない）

ということで、webpack が動いてないだけです。ので、解決策は、webpack を手で動かせば解決しますが….そりゃざっくりすぎるだろということでちょっと調べてみました。

解決方法

デバッグ時に、正しく動作するよう csproj ファイルを更新します。

プロジェクトを作成後、リモートにプッシュする前に csproj ファイルを修正しましょう。プロジェクトを右クリックして、「**.csproj ファイルを編集する」をクリックして、csproj ファイルを開きます。そして、

  <Target Name="PublishRunWebpack" AfterTargets="ComputeFilesToPublish">

と記載がある手前で以下を書いてあげましょう。やってることは Debug で指定のフォルダがなければ webpack を動かすという見たまんまです。

  <Target Name="DebugRunWebpack" BeforeTargets="Build" Condition=" '$(Configuration)' == 'Debug' And !Exists('wwwroot\dist') ">
    <!--Ensure Node.js is installed-->
    <Exec Command="node --version" ContinueOnError="true">
      <Output TaskParameter="ExitCode" PropertyName="ErrorCode" />
    </Exec>
    <Error Condition="'$(ErrorCode)' != '0'" Text="Node.js is required to build and run this project. To continue, please install Node.js from https://nodejs.org/, and then restart your command prompt or IDE." />

    <!--In development, the dist files won't exist on the first run or when cloning to
    a different machine, so rebuild them if not already present.-->
    <Message Importance="high" Text="Performing first-run Webpack build..." />
    <Exec Command="node node_modules/webpack/bin/webpack.js --config webpack.config.vendor.js" />
    <Exec Command="node node_modules/webpack/bin/webpack.js" />
  </Target>