在ASP.NET MVC中组合和缩小JS和CSS

时间:2012-10-06 05:53:32

标签: javascript asp.net-mvc minify

我创建了默认的ASP.NET MVC 3 Web应用程序。然后我将三个css和三个js文件添加到\ Views \ Shared_Layout.cshtml视图:

<!DOCTYPE html>
<html>
<head>
    <title>@ViewBag.Title</title>
    <link href="@Url.Content("~/Content/Site.css")" rel="stylesheet" type="text/css" />
    <link href="@Url.Content("~/Content/StyleSheet1.css")" rel="stylesheet" type="text/css" />
    <link href="@Url.Content("~/Content/StyleSheet2.css")" rel="stylesheet" type="text/css" />

    <script src="@Url.Content("~/Scripts/jquery-1.5.1.min.js")" type="text/javascript"></script>
    <script src="@Url.Content("~/Scripts/JScript1.js")" type="text/javascript"></script>
    <script src="@Url.Content("~/Scripts/JScript2.js")" type="text/javascript"></script>

</head>
<body>
    <div class="page">
        <div id="header">

...

当我运行应用程序时,我的HTML代码是

<!DOCTYPE html>
<html>
<head>
    <title>Home Page</title>
    <link href="/Content/Site.css" rel="stylesheet" type="text/css" />
    <link href="/Content/StyleSheet1.css" rel="stylesheet" type="text/css" />
    <link href="/Content/StyleSheet2.css" rel="stylesheet" type="text/css" />

    <script src="/Scripts/jquery-1.5.1.min.js" type="text/javascript"></script>
    <script src="/Scripts/JScript1.js" type="text/javascript"></script>
    <script src="/Scripts/JScript2.js" type="text/javascript"></script>

</head>
<body>
    <div class="page">

是否可以在MVC中使用处理程序将输出html更改为:

<!DOCTYPE html>
    <html>
    <head>
        <title>Home Page</title>
        <script src="js.axd=/Scripts/jquery-1.5.1.min.js,/Scripts/JScript1.js,/Scripts/JScript2.js" type="text/javascript"></script>
        <link href="css.axd=/Content/Site.css,/Content/StyleSheet1.css,/Content/StyleSheet2.css" rel="stylesheet" type="text/css" />
    </head>
    <body>
        <div class="page">

所以链接js.axd=/Scripts/jquery-1.5.1.min.js,/Scripts/JScript1.js,/Scripts/JScript2.js 将所有这些js文件的内容返回给浏览器,链接css.axd=/Content/Site.css,/Content/StyleSheet1.css,/Content/StyleSheet2.css将返回所有css文件的内容。

我之前在IHttpHandler的ASP.NET中做过一些事情,但是无法弄清楚如何在MVC中做到这一点,因为我只是MVC的首发。

任何帮助和代码示例都将不胜感激。 谢谢!

2 个答案:

答案 0 :(得分:13)

您可以使用捆绑和缩小nuget包。 Bundling and Minification

At the NuGet console type: "Install-Package Microsoft.AspNet.Web.Optimization"

此处示例:

Using Web Optimization with MVC 3

答案 1 :(得分:0)

我在自己的项目中使用cassette。此外,此列表here包含Nuget中的前20名。