将模块化JavaScript（RequireJS/AMD）与ASP.NET MVC捆绑并缩小_Javascript_Asp.net Mvc_Requirejs

将模块化JavaScript（RequireJS/AMD）与ASP.NET MVC捆绑并缩小

javascript asp.net-mvc requirejs

将模块化JavaScript（RequireJS/AMD）与ASP.NET MVC捆绑并缩小,javascript,asp.net-mvc,requirejs,Javascript,Asp.net Mvc,Requirejs,有没有人有过在ASP.NET MVC项目中捆绑和缩小模块化JavaScript（如RequireJS/AMD）的经验或知道任何好的解决方案是使用的最佳方式（可能在构建后操作中？），还是ASP.NET MVC有更好的解决方案？我不确定这是否是一个可接受的解决方案，但Visual Studio 2012有一个支持本机缩小和绑定的NuGet包（Microsoft.Web.Optimization）。我不确定它在2010年是否可用这是应用程序启动时的一行代码 Microsoft.Web.Optimi

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

是使用的最佳方式（可能在构建后操作中？），还是ASP.NET MVC有更好的解决方案？

我不确定这是否是一个可接受的解决方案，但Visual Studio 2012有一个支持本机缩小和绑定的NuGet包（Microsoft.Web.Optimization）。我不确定它在2010年是否可用

这是应用程序启动时的一行代码

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

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

例如

而不是

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

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

我没有使用RequireJS优化器的经验，不知道它是否处理匿名定义

更新：

我最近不得不这样做，我遇到的问题之一是脚本标记loading require.js的数据主属性。由于main.js文件依赖于捆绑模块，因此需要在main.js之前加载模块，但在require.js之后加载。所以我不得不放弃主数据，最后加载那个文件（未绑定）

从

到

我还没有看过，但是如果捆绑包配置可以确保main.js是最后一个，那么就不需要最后一个脚本标记。

以下是将RequireJS捆绑到main.js的步骤。您可以在

标记中找到一行。这并不能解决匿名定义的问题

HTML

main.js必须工作（我需要设置baseUrl）

由于AMD方法严重依赖于加载其他脚本的脚本，我认为您最好的选择是单独缩小每个脚本（不捆绑），或者使用RequireJS优化器，它尝试检测模块包含并相应捆绑。B/M链接已过时。查看我的B/M教程使用

BundleConfig.cs

可以将这三行减为一行，请参见下面我的答案。我认为BundleTables在MVC4中是新的。除了main.js和require.js之外，您没有绑定任何东西，因此任何其他依赖项都将以与以前相同的方式加载：逐个文件。这是无效的，您不会注意到在现实世界中有许多依赖项（您只保存了一个文件加载）的场景中有什么不同。在我的场景中，这只会将初始加载速度提高一点。由于它是一个单页应用程序，我实际上希望RequireJS稍后加载所有其他内容，一次加载一个。@myka eyl--您可能在Zach示例的狭窄范围内是对的。但是，我可以补充一点，他展示的是，如何将需求与bundle配置中指定的一个或多个bundle连接起来。在大多数情况下，我会为我的外部lib（jquery、knockout等）创建一个bundle，并通过require引用生产中的lib。我将在下面发布一个例子。

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

<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>

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

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"));
   }
}

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