使用ASP.NET MVC捆绑和缩小模块化JavaScript（RequireJS/AMD）

有没有人有任何经验或知道在ASP.NET MVC项目中捆绑和缩小模块化JavaScript（如RequireJS/AMD）的任何优秀解决方案？使用ASP.NET MVC捆绑和缩小模块化JavaScript（RequireJS/AMD）

是否使用RequireJS optimizer（可能在后期构建操作中？）的最佳方式 - 或者ASP.NET MVC中有更好的方法吗？

2012-07-20 kendaleiv

由于AMD的做法在很大程度上依赖于脚本加载其他脚本，我相信你最好的选择是无论是独立运行如下每个脚本（没有捆绑），或者实际上，可以使用RequireJS优化器，其尝试检测模块的夹杂物，并相应地捆绑。 – Avish 2012-07-20 21:08:32

我不确定这是否是可接受的解决方案，但Visual Studio 2012有一个支持本地缩小和捆绑的NuGet包（Microsoft.Web.Optimization）。我不知道它是否提供了2010

这是一个代码行中的Application_Start

Microsoft.Web.Optimization.BundleTable.Bundles.EnableDefaultBundles();

http://msdn.microsoft.com/en-us/vs11trainingcourse_aspnetandvisualstudio_topic5

来源

2012-07-20 20:38:53 McKay

该B/M链接已过时。见我的B/M教程http://www.asp.net/mvc/tutorials/mvc-4/bundling-and-minification – RickAndMSFT 2012-07-22 19:52:44

@RickAndMSFT啊，是的，谢谢。 – McKay 2012-07-23 14:28:30

我想你会打的问题是，如果你使用的匿名定义。如果您想要一个包含所有定义的组合/捆绑脚本文件，则必须命名它们。

例如。

define("someModule", ["jquery", "ko"], function($,ko) { ... });

代替

define(["jquery", "ko"], function($,ko) { ... });

如果您使用的文件名作为模块名，你就可以异步加载它们的（非绑定），以及预装（捆绑）。这样，您就可以在调试模式以及发布模式下工作，而无需更改您的需求。

我对RequireJS优化器没有经验知道它是否处理匿名定义。

UPDATE：

最近，我不得不这样做，很可能会遇到的问题之一是脚本代码加载require.js的数据主要属性。由于main.js文件依赖于捆绑的模块，因此需要在main.js之前加载，但在require.js之后加载。所以我不得不抛弃data-main并且最后加载那个文件（unbundled）。

从

<script src="../JS/require-v2.1.2.js" type="text/javascript" data-main="main.js"></script>

到

<script src="../JS/require-v2.1.2.js" type="text/javascript"></script> 
<%: System.Web.Optimization.Scripts.Render("~/bundles/signup") %> 
<script src="main.js" type="text/javascript"></script>

我还没有看，但如果束配置可以确保main.js是最后的，那么甚至不需要去年脚本标签。

来源

2012-11-13 21:59:47

您可以通过使用'BundleConfig.cs'，看到我的回答如下得到那些三线向下一个。我认为BundleTables是MVC 4中的新增功能。 – zacharydl 2014-03-22 00:57:58

这些是获取与main.js捆绑的RequireJS的步骤。您可以在<head>标记中找到一行。这并没有解决匿名定义的问题。

HTML

<head runat="server"> 
    <title></title> 
    <%: System.Web.Optimization.Scripts.Render("~/bundles/scripts") %> 
</head>

BundleConfig.cs

using System.Web; 
using System.Web.Optimization; 

public class BundleConfig 
{ 
    // For more information on bundling, visit http://go.microsoft.com/fwlink/?LinkId=301862 
    public static void RegisterBundles(BundleCollection bundles) 
    { 
     bundles.Add(new ScriptBundle("~/bundles/scripts").Include(
        "~/scripts/libs/require.js", 
        "~/scripts/main.js")); 
    } 
}

为主。JS必须努力without data-main（我需要设置的baseUrl）

require.config({ 
    baseUrl: "scripts" 
});

来源

2014-03-22 00:54:56 zacharydl

除了除了main.js和require.js以外的其他任何东西都没有捆绑在一起，所以其他依赖项的加载方式与之前的方式相同：file by file。这不是有效的，你不会注意到在你有很多的依赖关系（你只保存1个文件加载）真实的场景的差异。 – 2015-05-20 14:39:42

在我的场景中，这会加快初始负载的速度。由于它是一个单页面应用程序，因此我确实希望RequireJS稍后一次加载其他所有内容。 – zacharydl 2015-05-26 20:03:18

@myka EYL - 你可能是正确的扎克的例子范围窄。但是他所演示的，我可能会补充一点，就是你在捆绑配置中指定的一个或多个捆绑要求。在大多数情况下，我遇到过我会为我的外部库（jquery，knockout等）创建一个包，并通过require引用那些包。我会在下面发布一个例子。 – pimbrouwers 2016-09-17 19:42:59

我知道这是一个老问题，但你可以看看RequireJS.NET压缩机（使用YUI压缩机，而不是ASP.NET捆绑 - 至少目前）是RequireJS.NET NuGet包的一部分。

参考文献：

压缩机 - http://requirejsnet.veritech.io/compressor.html

一般文献 - http://requirejsnet.veritech.io/

Github上项目 - https://github.com/vtfuture/RequireJSDotNet

的NuGet - https://www.nuget.org/packages/RequireJsNet/

来源

2015-06-04 10:28:55