在ASP.NET MVC项目中,有没有人有任何关于捆绑和缩小像RequireJS / AMD这样的模块化JavaScript的好解决方案的经验?
使用RequireJS optimizer的最佳方法(可能是在后期构建操作中?) - 或者ASP.NET MVC有哪些更好的东西?
答案 0 :(得分:13)
我认为你遇到的问题是你使用匿名定义。如果您想要一个包含所有定义的组合/捆绑脚本文件,则必须为它们命名。
例如
define("someModule", ["jquery", "ko"], function($,ko) { ... });
而不是
define(["jquery", "ko"], function($,ko) { ... });
如果您使用文件名作为模块名称,您将能够异步加载(不捆绑)以及预加载(捆绑)。这样您就可以在调试模式和发布模式下工作,而无需更改您的要求。
我没有使用RequireJS优化器来了解它是否负责匿名定义。
更新:
我最近不得不这样做,我遇到的一个问题是加载require.js的脚本标记的data-main属性。由于main.js文件对捆绑模块有依赖性,因此需要在main.js之前加载,但需要在require.js之后加载。所以我不得不抛弃data-main并最后加载该文件(非捆绑)。
这
<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是最后一个,那么甚至不需要最后一个脚本标记。
答案 1 :(得分:2)
以下是将RequireJS与main.js捆绑在一起的步骤。您可以在<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"));
}
}
main.js必须正常工作without data-main(我需要设置baseUrl)
require.config({
baseUrl: "scripts"
});
答案 2 :(得分:0)
我不确定这是否是可接受的解决方案,但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
答案 3 :(得分:0)
我知道这是一个老问题,但你可以看看RequireJS.NET Compressor(使用YUI压缩器,而不是ASP.NET捆绑 - 至少目前),这是RequireJS.NET NuGet包的一部分。< / p>
参考文献:
Compressor - http://requirejsnet.veritech.io/compressor.html
一般文档 - http://requirejsnet.veritech.io/
Github项目 - https://github.com/vtfuture/RequireJSDotNet