2

我有一个 React 项目,我用yarn startthat runs运行它react-scripts start

我想使用 Visual Studio 2017 编辑代码并运行应用程序,但我不想使用 VS2017 node.js 的东西运行,我想按 F5 并继续使用 react-scripts。

有没有办法做到这一点?

## 更新 ##

对于那些想要更好的.njsproj文件格式的人,开发者社区中有一个值得支持的想法:https ://developercommunity.visualstudio.com/content/idea/351736/use-new-project-format-for-njsproj-文件.html

4

3 回答 3

3

另一种解决方法可能是将 package.json 上的脚本部分更改为

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

这将通过 Startup.cs 上的配置来实现。

if (env.IsDevelopment())
{
    spa.UseReactDevelopmentServer(npmScript: "start");
}
于 2019-03-07T12:19:35.797 回答
2

您可以将其添加为项目设置中的预构建步骤,但我认为更好的方法是在 .csproj 文件中使用自定义目标。我正在使用 vue 而不是反应。这是我在我的 .csproj 中使用的,你可以做类似的事情。

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

请注意,我还有一个基于调试配置的名为“ServerOnly”的附加构建配置,这样我就可以只调试服务器,而无需运行 yarn 或我的 npm 构建。

于 2019-01-04T17:09:33.463 回答
2

react 和所有其他单页应用程序项目都是一样的。我有一个用 react 编写的 SPA,我在 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>
于 2020-04-11T10:09:34.187 回答