在ASP.NET MVC视图中包含脚本引用的最佳方法是什么?

时间:2010-12-01 19:42:47

标签: javascript asp.net-mvc markup

如您所知,ASP.NET MVC将视图标记存储在Views目录中,该目录在层次结构上与ASP.NET MVC Web应用程序中使用的URL路由不兼容。另一方面,在ASP.NET Web Forms(以及ASP.NET MVC中)中,URL可以并且通常具有嵌套的“目录”,或者更确切地说是路径分隔符,这与Web应用程序通常不具备的事实相结合托管在URL的根路径中,而不是在子目录中,即“/ stuff / here / MyActualApp”,有必要使用相对于应用程序根目录的脚本路径,而不是相对于URL的根目录。但是,同时,Visual Studio脚本intellisense指示URL相对于正在编辑的文件进行映射。

此外,我遇到很多问题,使用runat =“server”虚拟化根路径以支持“〜/”,例如头标记也需要runat =“server”,这个介绍了各种其他约束。

最后,还有一件事:如果除了智能感知的味道之外还引用了像jQuery这样的脚本的简化风格,Visual Studio将会对此不予理睬。因此,您几乎必须使用转义代码来防止VS无法使用。

所以我一直在Visual Studio 2010中使用这种语法或其变体,因为VS 2005在我的ASP.NET视图标记中包含脚本来处理ASP.NET MVC视图文件的嵌套文件夹的差异(不要与实际的URL排列)以及需要使用jQuery的vsdoc风格而不是缩小版本,这样才能让intellisense工作。

<%if (false) { %>
<script src="../../Scripts/jquery-1.4.1-vsdoc.js" type="text/javascript"></script>
<% } %>
<%= "<script type=\"text/javascript\"" src=\"" 
  + ResolveUrl("~/Scripts/jquery-1.4.1.min.js") + "\"></script>"%>

除了使用CDN网址之外,还有比这更好的方法吗?它很丑。我希望微软现在可以解决这个问题,而不需要使用ScriptManager标签(这需要服务器端表单以及使标记更加冗长)。

注意:我的问题不在于Intellisense支持,而是上面代码中的最后一行,必须发出一行而不是仅仅使用真正的标记。但是,我也希望intellisense支持准备就绪。

4 个答案:

答案 0 :(得分:6)

我们使用SquishIt。它也结合并缩小了文件,并支持css(甚至dotLess)。

<head>
  <%= Bundle.Css()
    .Add("~/media/css/style.less")
    .Add("~/media/css/print.css")
    .Add("~/media/css/media.css")
    .Render("~/media/css/styles_#.css") %>
  <%= Bundle.JavaScript()
    .Add("~/media/js/jquery-1.4.3.js")
    .Add("~/media/js/jquery.equalHeights.js")
    .Add("~/media/js/jquery.cycle.lite.1.0.js")
    .Add("~/media/js/swfobject-2.2.js")
    .Add("~/media/js/site.js")
    .Render("~/media/js/js_#.js") %>
</head>

T4MVC还可以提供引用网址的方法:

<script src="<%= Links.Scripts.Map_js %>" type="text/javascript"></script>

答案 1 :(得分:2)

  
    

如您所知,ASP.NET MVC将视图标记存储在Views目录中,该目录与ASP.NET MVC Web应用程序中使用的URL路由在层次上不兼容

  

这是不正确的。您认为默认视图目录以何种方式与路由不兼容?

  
    

另一方面,在ASP.NET Web Forms(以及ASP.NET MVC中)中,URL可以并且通常具有嵌套的“目录”,或者更确切地说是路径分隔符,这与Web应用程序的事实相结合通常不在URL的根路径中托管,而是在子目录中,即“/ stuff / here / MyActualApp”,有必要使用相对于应用程序根目录的脚本路径而不是相对于根目录一个URL

         

必须使用相对于应用程序根目录的脚本路径,而不是相对于URL的根目录

  

root或Url是什么意思? 默认情况下,MVC不使用嵌套的directorys(除非您将RouteExistingFiles设置为true)对于具有嵌套目录的URL,这意味着什么? MVC路由使用段而不是路径分隔符。

  
    

应用程序通常不托管在URL的根路径中,而是托管在子目录中     更准确地说,应用程序托管在不在根级别的vdir中。使用MVC 3及更低版本,您需要使用@ Url.Content帮助程序引用静态资源(css,javaScript)。

  

使用MVC 4 / Beta + Razor及更高版本,您不再需要使用@ Url.Content助手。

  
    

此外,我遇到很多问题,使用runat =“server”虚拟化根路径以支持“〜/”,例如头标记也需要runat =“server”,这个介绍各种其他约束

  

永远不要将runat =“server”与MVC应用程序一起使用来虚拟化根路径。

  
    

需要使用jQuery的vsdoc风格而不是缩小版本,这样才能让intellisense工作。     这又是不正确的。您永远不应该直接引用vdoc版本。 Visual Studio / VWD检测脚本文件的.vdoc版本何时存在并启用智能。

  

您的助手方法可能是最佳途径。您可以修改我的帮助方法http://blogs.msdn.com/b/rickandy/archive/2011/05/21/using-cdns-to-improve-web-site-performance.aspx

通常人们会注释掉.min引用以便开发生产的开关注释以使用缩小版本。我们实际上正致力于使用minificatin / bundling来切换开发/生产。见RequestReduce。和http://weblogs.asp.net/scottgu/archive/2011/11/27/new-bundling-and-minification-support-asp-net-4-5-series.aspx

答案 2 :(得分:0)

你可以在开发过程中给出这样的东西,这样它就会向你显示智能

<reference path="http://code.jquery.com/jquery-1.4.1.js"/>

答案 3 :(得分:-1)

在ASP.NET MVC 4中,Razor已经变得足够智能以支持“〜/”检测。希望VS11智能感知工具能够跟上这一步。

<script src="~/Scripts/Controls.js"></script>

New in ASP.NET MVC4: Razor changes (Alexander Beletsky)

与此同时,Visual Studio工具和jQuery源代码(因为jQuery在问题中被用作参考)自从最初被问到这个问题以来都被大量修改过。 RickAndMSFT的回答当时不适用。目前,他的回答是正确的;然而,由于这是一个移动的目标,看起来到今年年底,人们只会直接引用脚本,而Razor和修改后的VS工具将会处理所有事情。