javascript - Web Essentials 是否提供了一种在生产中使用捆绑的 js 文件但在开发中使用单个 js 文件的方法？

Question

设置:

我有一个大型 SPA 应用程序，它使用许多使用 Web Essentials 捆绑的 JavaScript 文件 在 Visual Studio 2013 中捆绑。然后，我将 Web Essentials 生成的缩小 js 文件包含在我的 HTML 页面上。此应用程序不使用 ASP.NET

问题:

我希望能够分发 HTML 页面，其中引用了用于生产的单个缩小脚本，以及用于开发的各个未缩小脚本。

原因:

即使带有 map 文件的缩小脚本也很难调试。变量和参数名称已缩小，因此调试器与源代码不匹配。此外，由于所有内容都在一个文件中，因此很难进行开发。

当前解决方案:

我有一个 grunt 任务进入我的 html 文件并修改它使得 <script>标签被替换。这有随着我添加到页面的每个文件而增长的缺点。

Web Essentials 是否提供了比我目前正在做的更好但我可能只是忽略了的解决方案？

Answer 1

您将捆绑工具与引用实现混合在一起。

Web Essentials 2013 构建压缩(缩小)JavaScript、CSS、LESS、 SASS 和图像文件。 Web Essentials 应该创建缩小包，无论您是否处于 Debug模式。

您正在寻找一种在Release 模式下有选择地引用 minfied 文件和在Debug 下引用原始文件的方法。这可能意味着需要使用 Razor 编码来检查发布版本和渲染引用调用。

更好的解决方案是使用 ASP.NET Bundling and Minification .

It's easy to debug your JavaScript in a development environment (where the compilation Element in the Web.config file is set to debug="true" ) because the JavaScript files are not bundled or minified when debug="true"

如果您的 Web.config 中有 debug="true"，则压缩包仍然存在。但在运行时，框架将引用原始文件而不是缩小后的文件。您的 Web.config 现在负责维护引用的 Assets 版本。

Web Essential bundle 是被动 Assets 。 Web Essentials 中没有区分 Release模式和 Debug模式的功能，因为这是一个运行时操作。

---

注意: Web Essentials 2015.0 已删除捆绑和缩小。

Important!

Web Essentials 2015 no longer contains features for bundling and minifying of JS, CSS and HTML files as well as compiling LESS, Scss and CoffeeScript files. Those features have been moved to their own separate extensions that improves the features greatly

通常的做法是使用 ASP.NET Bundler。这是避免与 Web Essentials 捆绑的另一个原因。