How to make Visual Studio 2017 call the `yarn start`

Question

I have a React project, and I run it with yarn start that runs react-scripts start.

I want to use Visual Studio 2017 to edit code and run the app, but I don't want to run using the VS2017 node.js things, I want to hit F5 and continue using the react-scripts.

Is there some way to do that?

## Update ##

For those who want a better .njsproj file format, there is this idea in the developer community that deserve an upvote: https://developercommunity.visualstudio.com/content/idea/351736/use-new-project-format-for-njsproj-files.html

Answer 1

You could add it as a pre-build step in the project settings, but I think a better way is with custom targets in your .csproj file. I'm using vue instead of react. This is what I use in my .csproj, and you could do something similar.

  <Import Project="$(MSBuildToolsPath)\Microsoft.CSharp.targets" />
  <Target Name="RunNpmBuild" Condition="'$(Configuration)' != 'ServerOnly'">
    <Exec Command="yarn" WorkingDirectory="./www" />
    <Exec Command="npm run build" WorkingDirectory="./www" />
  </Target>
  <Target Name="BeforeBuild" DependsOnTargets="RunNpmBuild">
  </Target>

Note that I also have an additional build configuration called "ServerOnly" based on the debug configuration so that I can f5 debug just the server without having to run yarn or my npm build.