Question

我有一个带有角度cli的角度应用程序构建。我希望我的web-api能够提供来自wwwroot文件夹的静态文件。我还想让两个项目在他们自己的文件夹中很好地分开。这是我的解决方案的结构：

.\angular-app
.\angular-app\angular-cli.json
.\web-api-app
.\web-api-app\wwwroot

鉴于我的应用程序的这种结构，我想要的是配置我的msbuild脚本web-api-app.csproj以某种方式从angular-app中触发“ng build”并在wwwroot文件夹中输出构建。 / p>

因此，我将.angular-cli.json中的“outDir”参数修改为：“../ web-apiapp /wwwroot”，这样当我在angular-app中调用“ng build”时，webpack将结果输出到wwwroot文件夹中。

如何设置我的MsBuild脚本，以便在我调用＆＃34; dotnet build -c Release＆＃34; angular很好地打包在wwwroot文件夹里面？

Answer 1

我找到了一种能够在我的msbuild中调用«ng build»的方法。诀窍是在DotNetCore应用程序的根目录中使用npm脚本，将其“cd”到角度应用程序中，然后调用“ng build”。这些是我采取的步骤： 1）为了能够使用npm脚本命令编辑angular-app的package.json的脚本部分:(这里我还定义了一个启动脚本，可以轻松启动我的本地开发环境和构建，以便能够构建我的脚本在调试模式下）

"scripts": {
    "start": "ng serve --proxy-config proxy.conf.json",
    "build": "ng build",
    "build-prd": "ng build --prod --env=prod",
 }

2）使用Web-Api应用程序，在web-api应用程序的根目录中添加一个package.json，其中包含：

"scripts": {
        "install": "cd ../angular-app & npm install",
        "start": "cd ../angular-app & npm start",
        "build": "cd ../angular-app & npm run-script build",
        "build-prd": "cd ../angular-app & npm run-script build-prd"
}

3）最后，配置web-api MsBuild脚本以在运行发布版本时调用ng构建脚本。因此，将以下目标添加到csproj文件中：

<Target Name="EnsureNode">
  <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." />
</Target>
<Target Name="ReleaseRunNgBuild" BeforeTargets="Build" Condition=" '$(Configuration)' == 'Release' ">
  <CallTarget Targets="EnsureNode" />
  <Message Importance="high" Text="Install packages..." />
  <Exec Command="npm install" />
  <Message Importance="high" Text="Performing ng build for prd build..." />
  <Exec Command="npm run-script build-prd" />
</Target>

我创建了一个示例应用，您可以在my github project core-angular-example找到完整的源代码，this blog post也会详细描述每一步。

Answer 2

一个适用于我的.NET Core的简单解决方案

  <Target Name="Build Angular" BeforeTargets="Build">
    <Message Text="Build in process" Importance="high" />
    <Exec Command="cd angular-app &amp;&amp; ng build --prod --aot"  />
  </Target>

如何触发＆＃34; ng build＆＃34;从一个带有msbuild的dotnetcore web-api项目中，但是将角度项目保存在一个单独的文件夹中？

2 个答案: