DotNet Core 2.0 WebDeploy call to npm build not working on Publish

Question

I have in past used a strategy whereby our backend devs work in VisualStudio and our UI guys work purely in Sublime/VSCode etc. During website publish in VS2017, I used a publish target to first run npm install, then npm build (to bundle our app.js logic), then include that front end content into the backend package for WebDeploy.

I am trying to replicate this in a dotnet core 2.0 project, but the publish target calls to build the front end are never called (ie you never see the echo command content, nor does the npm install / build run)... so no UI resources are included when the publish happens unless i had previously manually run the build process to generate them from VSCode and they already exist on disk. Ie. the COPYING of the UI generated files works great (if they exist)... but VS2017 is never calling the npm commands to BUILD the resources?

While a touch fiddly, this works great in several .NET 4.6+ projects. I have just copied that exact same logic to a Core 2.0 project, and for some reason it isnt working the way I expect? Any ideas?

E.g. my ProjectDeploy.pubxml file contains (at the bottom before the final closing 'Project' tag):

  <!-- 
  make sure that we BUILD the UI *before* we copy the files to the package
  See: http://byalexblog.net/using-msbuild-to-deploy-composite-web-application
  See: http://www.codecadwallader.com/2015/03/15/integrating-gulp-into-your-tfs-builds-and-web-deploy/
  -->
  <PropertyGroup>
    <!-- relative path back out of 'current' folder to outside location of the UI files -->
    <FrontEndLocalPath>..\..\src-app</FrontEndLocalPath>
  </PropertyGroup>
  <!-- 
  Build the mobile web app assets , ensuring that all packages are installed and up to date
  -->
  <Target Name="BuildFrontEnd">
    <Exec Command="echo Got Here also Dale" />
    <!-- requires that NPM be installed in environment variables, which we will assume rather than use the NPM env variable above -->
    <!-- call npm install -->
    <exec command="npm install" WorkingDirectory="$(FrontEndLocalPath)" />
    <!-- Run npm run build to populate the www folder with your latest minified production build. -->
    <exec command="npm run build" WorkingDirectory="$(FrontEndLocalPath)" />
  </Target>
  <!--
  On each package and/or deploy (because they are different), we want to ensure that we bundle up all the Angular dist code and include that as part of the package / deployment.
  See: https://learn.microsoft.com/en-us/aspnet/web-forms/overview/deployment/visual-studio-web-deployment/deploying-extra-files
  -->
  <Target Name="CustomCollectFiles" DependsOnTargets="BuildFrontEnd">
    <Exec Command="echo Got Here Dale" />
    <ItemGroup>
      <_CustomFiles Include="$(FrontEndLocalPath)\www\**\*" />
      <FilesForPackagingFromProject Include="%(_CustomFiles.Identity)">
        <DestinationRelativePath>wwwroot\%(RecursiveDir)%(Filename)%(Extension)</DestinationRelativePath>
      </FilesForPackagingFromProject>
    </ItemGroup>
  </Target>
  <PropertyGroup>
    <CopyAllFilesToSingleFolderForPackageDependsOn>CustomCollectFiles;</CopyAllFilesToSingleFolderForPackageDependsOn>
    <CopyAllFilesToSingleFolderForMsdeployDependsOn>CustomCollectFiles;</CopyAllFilesToSingleFolderForMsdeployDependsOn>
  </PropertyGroup>

Answer 1

Okay, so I don't know if this is specific to new dotnetcore 2.0 or not, but I followed these links and got things working perfectly. Working from the inbuilt VS2017 SPA templates, I now no longer follow the approach we used in .NET 4.6 to modify the .pubxml publish profile to attempt a build/copy files.. instead the gulp/webpack build-SPA-and-copy-files-on-build logic is included in the .csproj file. Note that the benefit of this is you can BUILD your solution quickly without building the UI each time, but still bundle up all fresh UI changes on deployment. My working example follows link:

https://stackoverflow.com/a/44429390/4413476

<PropertyGroup>
    <!-- 
    relative path back out of 'current' folder to outside location of the 
    custom single page app UI files (and any other paths we require)
    -->
    <FrontEndLocalPath>..\..\src-app</FrontEndLocalPath>
  </PropertyGroup>

  <Target Name="DebugBuildSPA" 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="npm install" WorkingDirectory="$(FrontEndLocalPath)" />
    <exec command="npm run build" WorkingDirectory="$(FrontEndLocalPath)" />
  </Target>

  <Target Name="PrepublishScript" BeforeTargets="PrepareForPublish" Condition=" '$(IsCrossTargetingBuild)' != 'true' ">
    <!-- Build our single page application content -->
    <exec command="npm install" WorkingDirectory="$(FrontEndLocalPath)" />
    <exec command="npm run build" WorkingDirectory="$(FrontEndLocalPath)" />
    <ItemGroup>
      <Dist Include="$(FrontEndLocalPath)\www\**;" />
    </ItemGroup>
    <Copy SourceFiles="@(Dist)" DestinationFolder="$(PublishDir)\wwwroot\%(RecursiveDir)" SkipUnchangedFiles="true" />
  </Target>