在 ASP.NET Core 2.0 和 Visual Studio 2017 中发布 dotnet 期间的 Aurelia 和 webpack答案

【问题标题】：Aurelia and webpack during dotnet publish in ASP.NET Core 2.0 and Visual Studio 2017在 ASP.NET Core 2.0 和 Visual Studio 2017 中发布 dotnet 期间的 Aurelia 和 webpack
【发布时间】：2018-10-09 22:23:46
【问题描述】：

ASP.NET Core 2.0 项目使用 Aurelia 引入

au new --here

我想在发布解决方案时创建以下工件

\wwwroot\dist\app.bundle.js
\wwwroot\dist\vendor.bundle.js

我可以通过手动运行来实现这一点

npx webpack --config webpack.netcore.config.js

但我想在发布时启动 webpack 构建：

dotnet publish -c Release

我的最终目标是让 VSTS CI/CD 进程使用 MSBuild 自动捆绑上述要求的 SPA 文件。

请注意，在开发过程中，我已经通过热模块替换

using Microsoft.AspNetCore.SpaServices.Webpack;

和

if (env.IsDevelopment())
{
    app.UseDeveloperExceptionPage();
    app.UseWebpackDevMiddleware(new WebpackDevMiddlewareOptions
    {
      HotModuleReplacement = true, 
      ConfigFile="webpack.netcore.config.js",
      HotModuleReplacementClientOptions = new Dictionary<string,string>{
        {"reload", "true"}
      }
    });
}

这按预期工作。但现在我需要在发布期间实现相同的目标。

作为快速修复，我添加了一个构建后事件

  <Target Name="PostBuild" AfterTargets="PostBuildEvent">
    <Exec Command="npx webpack --config webpack.netcore.config.js" />
  </Target>

如何获得自定义 MSBuild RunWebpack 目标的解释 here？

【问题讨论】：

为什么要对 MSBuild 目标执行此操作？发布 =/= 构建。我要么把它放在 psake 构建脚本中，要么放在 VSTS 构建任务或类似的东西中......
明确地说，我不一定要质疑或批评这个选择，我真的很想知道你为什么特别想这样做（如果这是一个有意识的选择）或者如果它没关系。这些信息会让我更容易帮助你。

标签： asp.net-core aurelia asp-net-core-spa-services

【解决方案1】：

所以我也遇到了同样的问题。我注意到在 webpack.config.js 文件中有以下几行：

output: {
    path: outDir,
    publicPath: baseUrl,
    filename: production ? '[name].[chunkhash].bundle.js' : '[name].[hash].bundle.js',
    sourceMapFilename: production ? '[name].[chunkhash].bundle.map' : '[name].[hash].bundle.map',
    chunkFilename: production ? '[name].[chunkhash].chunk.js' : '[name].[hash].chunk.js'
  },

但在 webpack.netcore.config.js 文件中有：

config.output.filename = '[name].bundle.js';

因此，当您发布它时，它希望 .net 核心复制 app.bundle.js 和 vendor.bundle.js 文件，但它们不存在，因为 webpack 由于缓存目的而将其使用不同的文件名。所以将该行替换为以下内容：

config.output.filename = '[name].[chunkhash].bundle.js';

【讨论】：