结合在ASP.NET MVC与缩小JS和CSS [英] Combining and minifying JS and CSS in ASP.NET MVC

查看:120
本文介绍了结合在ASP.NET MVC与缩小JS和CSS的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

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

I created default ASP.NET MVC 3 web application. Then I added three css and three js files to \Views\Shared_Layout.cshtml view:

<!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的code是

when I run the application, I html code is

<!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输出喜欢:

Is it possible to have a handler in MVC to change my output html to like:

<!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 = /脚本/ jQuery的-1.5.1.min.js,/脚本/ JScript1.js,/脚本/ JScript2.js
将返回所有这些JS文件的内容到浏览器,并链接 css.axd = /内容/的site.css,/内容/ StyleSheet1.css,/内容/ StyleSheet2.css 将返回所有CSS文件的内容。

So the link js.axd=/Scripts/jquery-1.5.1.min.js,/Scripts/JScript1.js,/Scripts/JScript2.js will return content of all these js files to the browser, and link css.axd=/Content/Site.css,/Content/StyleSheet1.css,/Content/StyleSheet2.css will return content of all css files.

我没有通过的IHttpHandler在ASP.NET之前的东西,但无法弄清楚如何做到这一点的MVC,因为我在MVC刚刚启动。

I did something before in ASP.NET by IHttpHandler, but can't figure out how to do that in MVC, since I'm just starter in MVC.

任何帮助和code的样本将AP preciate。
谢谢!

Any help and code samples will appreciate. Thank you!

推荐答案

您可以使用捆绑和微小的NuGet包。 捆绑和微小

You can use bundle and minification nuget package. Bundling and Minification

在控制台的NuGet类型:安装封装Microsoft.AspNet.Web.Optimization

例如,在这里:

使用Web优化与MVC 3

这篇关于结合在ASP.NET MVC与缩小JS和CSS的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆