在 msbuild 输出中包含 Angular dist 文件夹答案

【问题标题】：Include Angular dist folder in msbuild output在 msbuild 输出中包含 Angular dist 文件夹
【发布时间】：2018-03-15 05:23:23
【问题描述】：

我有一个 Mvc 项目，其中有一个由 webpack 捆绑的 Angualar2 应用程序。所以当我在根目录上执行 npm run build:prod 时，会生成 dist 文件夹。之后，当我对项目执行 msbuild dist 文件夹不包含在项目输出中，因为它不包含在项目中。无论如何我可以在我的构建输出文件夹中包含 dist 文件夹而不包含在项目中这是 Jenkins Auto 部署所需要的。任何方法建议都非常值得赞赏。

【问题讨论】：

您可以将outDir 设置为.angular-cli.json 中的任意位置。喜欢outDir: "../msbuild/some-project/out-folder"
@BunyaminCoskuner 在大多数带有 Angular 的 ASP .Net MVC 项目中，Angular 应用程序将位于子文件夹中（不在项目根目录中）。因此，这将需要有角度的 CLIS ng build 才能访问 CLI 根目录之外的文件夹路径。不确定 outDir 是否可以定向到其范围之外的随机文件夹
@DavidChelliah 是的，它可以。我在 Java 应用程序中做过类似的事情。您可以在文件系统中提供您想要的任何文件路径。

标签： angular jenkins webpack msbuild

【解决方案1】：

您无需在 Jenkins 中创建单独的任务，因为这需要您硬编码 From（源签出）路径和 To（发布包位置）路径。

所以更简单和最好的方法是以下一种，

您只需创建自定义任务并将其连接到已经可用的 MSBuild 管道目标。

在发布打包期间包含所有不属于 .csproject 的文件（即不包含在 .csproj 中）

1) 挂钩 CopyAllFilesToSingleFolderForPackage 操作并将其指向为复制 Angular 文件定义的自定义目标 - CollectAngularFiles

<CopyAllFilesToSingleFolderForPackageDependsOn>
      CollectAngularFiles;
      $(CopyAllFilesToSingleFolderForPackageDependsOn);
</CopyAllFilesToSingleFolderForPackageDependsOn>

2) 定义你的目标 [ng\dist - 是我的角度 output/dist 文件夹]

<Target Name="CollectAngularFiles">
<ItemGroup>
  <GeneratedScripts Include="ng\dist\**\*" />
  <FilesForPackagingFromProject Include="%(GeneratedScripts.Identity)">
    <DestinationRelativePath>ng\dist\%(RecursiveDir)%(Filename)%(Extension)</DestinationRelativePath>
  </FilesForPackagingFromProject>
</ItemGroup>

如需更清晰的实施指南，您可以查看以下博客文章 https://davidsekar.com/angular/include-angular-generated-files-in-msbuild-package

【讨论】：