2
votes

Comment faire en sorte que Visual Studio 2017 appelle le `yarn start`

J'ai un projet React, et je l'exécute avec yarn start qui exécute react-scripts start .

Je souhaite utiliser Visual Studio 2017 pour modifier le code et exécuter l'application, mais je ne veux pas exécuter avec les choses VS2017 node.js, je veux appuyer sur F5 et continuer à utiliser les scripts de réaction.

Y a-t-il un moyen de le faire?

## Update ##

Pour ceux qui veulent un meilleur format de fichier .njsproj , il y a cette idée dans la communauté des développeurs qui mérite un vote positif: https://developercommunity.visualstudio.com/content/idea/351736/use-new-project- format-pour-njsproj-files.html

visual-studio yarnpkg visual-studio-2017 react-scripts

0 commentaires

3 Réponses :

2
votes

Vous pouvez l'ajouter comme étape de pré-construction dans les paramètres du projet, mais je pense qu'une meilleure façon est d'utiliser des cibles personnalisées dans votre fichier .csproj. J'utilise vue au lieu de react. C'est ce que j'utilise dans mon .csproj, et vous pouvez faire quelque chose de similaire.

  <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>

Notez que j'ai également une configuration de construction supplémentaire appelée "ServerOnly" basée sur la configuration de débogage afin que je puisse f5 ne débogue que le serveur sans avoir à exécuter yarn ou ma build npm.

0 commentaires

2
votes

Une autre solution de contournement pourrait être de changer votre section de script sur package.json en

if (env.IsDevelopment())
{
    spa.UseReactDevelopmentServer(npmScript: "start");
}

qui sera atteinte par une configuration sur Startup.cs.

"scripts": {
    "start": "yarn react-scripts start"
     ...
}

0 commentaires

2
votes

C'est la même chose pour react et tous les autres projets d'application d'une seule page. J'ai un SPA écrit en react et je l'ai utilisé dans le fichier csproj

        <Target Name="DebugEnsureNodeEnv" BeforeTargets="Build" Condition=" '$(Configuration)' == 'Debug' And !Exists('$(SpaRoot)node_modules') ">
        <!-- 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." />
        <Message Importance="high" Text="Restoring dependencies using 'yarn'. This may take several minutes..." />
        <Exec WorkingDirectory="$(SpaRoot)" Command="yarn install" />
      </Target>
<Target Name="PublishRunWebpack" AfterTargets="ComputeFilesToPublish">
    <!-- As part of publishing, ensure the JS resources are freshly built in production mode -->
    <Exec WorkingDirectory="$(SpaRoot)" Command="yarn install" />
    <Exec WorkingDirectory="$(SpaRoot)" Command="yarn build" />

    <!-- Include the newly-built files in the publish output -->
    <ItemGroup>
      <DistFiles Include="$(SpaRoot)build\**; $(SpaRoot)build-ssr\**" />
      <ResolvedFileToPublish Include="@(DistFiles->'%(FullPath)')" Exclude="@(ResolvedFileToPublish)">
        <RelativePath>%(DistFiles.Identity)</RelativePath>
        <CopyToPublishDirectory>PreserveNewest</CopyToPublishDirectory>
      </ResolvedFileToPublish>
    </ItemGroup>
  </Target>

0 commentaires