Question

在开发与生产环境中使用ASP.NET Core bundleconfig.json的最佳做法是什么？先前的bundler（BundleCollection）会关注DEBUG编译器指令，而不是在你调试时缩小脚本列表。

似乎新范例是在HTML模板中使用<environment>标记来测试ASPNETCORE_ENVIRONMENT值。虽然我没有看到将该环境变量合并到bundleconfig.json工作流程中的方法。

我看到的一种方法是在bundleconfig.json，缩小和非缩小版本中为每个捆绑输出维护2个列表，以便可以调试JavaScript。或者，我可以直接链接到开发<environment>标记中的非捆绑JavaScript，然后在production / staging <environment>标记中引用捆绑和缩小版本。

无论哪种方式，都需要维护2个JavaScript文件列表（所有这些都适用于CSS文件）。这似乎是向后退一步，在此之前你只需要维护一个源文件列表，而BundleCollection只会在适当的时候缩小。

我在这里遗漏了什么，或者我是否需要更进一步调查Gulp以便能够处理不同的环境？

Answer 1

我想我找到了答案。我正要创建一个HTML帮助程序来阅读开发环境的bundleconfig.json，但看起来我并不是第一个认为这是个好主意的人。请注意，.NET Core实现链接到页面底部

https://github.com/madskristensen/BundlerMinifier/wiki/Unbundling-scripts-for-debugging

修改

对于.NET Core实现，对bundleconfig.json的引用期望它位于/ Configs文件夹中，这可能是您项目中的情况，也可能不是。对我来说，我只是在项目的根目录中。

修改

如果源文件位于wwwroot文件夹之外，那么这不起作用。将文件放在wwwroot文件夹之外是完全合理的，所以我正在调查让html助手指向将以调试模式传输文件的路径

可能的解决方案

这是我解决方案的演变：

https://gist.github.com/rupe120/512a9eb837383963f80fd9ef4984eb15

<强>更新

我修改了我的解决方案，在路由定义中使用{*filePath}，因此现在不需要对路径进行编码

<强>更新

我认为这是我要做的最后一次重大更新。我用outputFileName中的bundleconfig.json值替换了静态基本路由字符串。所以现在有很多调试路由，因为会有缩小的文件，不用担心名称冲突。此外，您可以在调试时查看哪些文件包含在哪个文件包中，我觉得这很酷。

Answer 2

我不会完全将其称为最佳实践，但以下内容对我有用。

在bundleconfig.json中，我准备了一捆用于开发，一捆用于生产。用于开发的捆绑包只是连接的文本，易于阅读和调试。用于生产的捆绑包已最小化，可以选择包括源地图。

{
    "outputFileName": "wwwroot/script.bundle.js",
    "inputFiles": [
      "wwwroot/node_modules/popper.js/dist/umd/popper.js",
      "wwwroot/node_modules/jquery/dist/jquery.js",
      "wwwroot/node_modules/bootstrap/dist/js/bootstrap.js"
    ],
    "minify": {
      "enabled": false,
      "renameLocals": false
    }
  },
  {
    "outputFileName": "wwwroot/script.min.js",
    "inputFiles": [
      "wwwroot/script.bundle.js"
    ],
    "minify": {
      "enabled": true,
      "renameLocals": true
    },
    // Optionally generate .map file
    "sourceMap": false
  }

重点是，生产捆绑包仅使用开发捆绑包。这样，我只需要保留一个列表。

在需要JS的页面上，我添加了两个捆绑软件的标签。

<environment include="Development">
    <script src="script.bundle.js" type="text/javascript"></script>
</environment>
<environment exclude="Development">
    <script src="script.min.js" type="text/javascript"></script>
</environment>

Answer 3

我和乔什（Josh）在一起，似乎很疯狂，不得不保留两个清单。是否有人不使用MvcHtmlString帮助程序就能得到更好的内置解决方案！

“ sourceMap”：是

如果在bundleconfig.json中启用，则可以调试进入js 但我注意到，如果您要捆绑，它将无法正确生成地图，无法引用合并的文件和每个映射的文件...

Smidge似乎提供了此功能-一个简单的标志-debug =“ true”

<environment names="Development">
    <script src="my-awesome-js-bundle" type="text/javascript" debug="true"></script>
</environment>
<environment names="Staging,Production">
    <script src="my-awesome-js-bundle" type="text/javascript"></script>
</environment>

Webpack或gulp是必经之路-这是值得商which的。

如何在多种环境中管理ASP.NET Core bundleconfig.json？

3 个答案: