MVC4中的Styles.Render

381

在一个.NET MVC4项目中如何@Styles.Render运作？

我的意思是，它在@Styles.Render("~/Content/css")哪个文件中调用？

我的文件夹中没有文件或名为“ css”的Content文件夹。

c# asp.net-mvc razor asp.net-mvc-4

— 里卡多·波罗·贾拉米洛
source

11

参见我的asp.net/mvc/tutorials/mvc-4/bundling-and-minification教程

— RickAndMSFT 2012年

453

它正在调用包含BundleConfig在该App_Start文件夹内的类中的特定捆绑软件中的文件。

在这种特定情况下，的呼叫 @Styles.Render("~/Content/css")正在呼叫“〜/ Content / site.css”。

bundles.Add(new StyleBundle("~/Content/css").Include("~/Content/site.css"));

— 努诺·卡莫
source

22

要知道的一件事是，它不会将已经最小化的.css文件添加到捆绑软件中。示例：它不适用于bootstrap.min.js，仅适用于bootstrap.js。我希望这可以帮助其他人。

— Codea 2014年

5

这是在谈论样式，而不是脚本。如果要使用bootstrap.min.js，只需创建一个如下所示的包：bundles.Add（new ScriptBundle（“〜/ bundles / bootstrap”）。Include（“〜/ Scripts / bootstrap.min.js”））;

— Xcalibur37

1

@codea我不确定您的设置是什么，但是默认情况下，捆绑程序将*.min.*接管*.*文件。

— skmasq '16

@skmasq，在编写这些行时，我正在使用VS2013。到现在为止情况可能已经改变。感谢您提到:)

— 编码

我不明白。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。，。如果以布局文件或局部视图的形式将所有CSS链接添加到样式表，则也可以在一个简单的位置进行管理。对于像这样的硬编码样式路径来说，这也是一个糟糕的设计，因为您不能再创建CSS外观，而20年前设计时就已经创建了CSS外观。

— Stokely

34

当心区分大小写。如果您有档案

/Content/bootstrap.css

然后您将Bundle.config中的重定向到

.Include（“〜/ Content / Bootstrap.css”）

它不会加载css。

— Linktoemi
source

另外：第二个include的拼写不同。

— 丹·埃斯帕萨

1

是否也支持sass / less-files？

— Manticore

12

晚会晚了一点。但似乎没有人提到
的捆绑和微小的StyleBundle，所以..

@Styles.Render("~/Content/css")

致电Application_Start()：

BundleConfig.RegisterBundles(BundleTable.Bundles);

依次调用

public static void RegisterBundles(BundleCollection bundles)
{
    bundles.Add(new StyleBundle("~/Content/css").Include(
              "~/Content/bootstrap.css",
              "~/Content/Site.css"));
}

RegisterBundles()有效地合并并缩小 bootstrap.css并 Site.css
合并为一个文件，

<link href="/Content/css?v=omEnf6XKhDfHpwdllcEwzSIFQajQQLOQweh_aX9VVWY1" rel="stylesheet">

但是 ..

<system.web>
  <compilation debug="false" targetFramework="4.6.1" />
</system.web>

仅当 debug设为false时Web.config。
否则bootstrap.css＆Site.css将单独提供。
没有捆绑，也没有缩小：

<link href="/Content/bootstrap.css" rel="stylesheet">
<link href="/Content/Site.css" rel="stylesheet">

— 萨姆
source

0

src="@url.content("~/Folderpath/*.css")" 应该渲染样式

— 内存
source

0

如App_start.BundleConfig中所定义，它只是在调用

bundles.Add(new StyleBundle("~/Content/css").Include("~/Content/site.css"));

即使删除该部分，也不会发生任何事情。

— Sathish Dadi
source

0

Polo我出于多种原因不会在MVC中使用捆绑软件。在您的情况下，它不起作用，因为您必须在Apps_Start文件夹中设置自定义BundleConfig类。当您可以像这样简单地在html头中添加样式时，这没有任何意义：

<link rel="stylesheet" href="~/Content/bootstrap.css" />
<link rel="stylesheet" href="~/Content/bootstrap.theme.css" />

您也可以将它们添加到Layout.cshtml或部分类中，该类将从所有视图中调用并放到每个页面中。如果样式发生更改，则可以轻松更改名称和路径，而无需重新编译。

在类中添加到CSS的硬编码链接会破坏将UI和设计与应用程序模型分离的整个目的。您也不想在c＃中管理硬编码的样式表路径，因为您不能再为不同的设备，主题等构建“皮肤”或单独的样式模型，例如：

<link rel="stylesheet" href="~/UI/Skins/skin1/base.css" />
<link rel="stylesheet" href="~/UI/Skins/skin2/base.css" />

使用此系统和Razor，您现在可以从数据库或用户设置中切换出“外观路径”，并且只需动态更改路径即可更改网站的整体设计。

15年前，CSS的全部目的是为网站开发用户控制和应用程序控制的样式表“皮肤”，以便您可以将UI外观与应用程序分离开来，并独立于数据结构来重新调整内容的用途。 ....例如可打印版本，移动版本，音频版本，原始xml等。

现在回到使用C＃类，Bootstrap之类的刚性样式并将站点主题与应用程序代码合并的“老式”，硬编码路径系统，我们又回到了1998年建立网站的方式。

— 斯托克利
source

1

那么，minification那么呢？：s / :(

— 斯科特·弗雷利

是。为什么开发人员会在2019年将CSS和JavaScript最小化，然后再构建Angular等API，并将其他API发送给客户端？我们过去常常向带宽有限的客户发送较少的代码或压缩的代码，以便他们在受到带宽限制的情况下可以获取代码...即14k波特调制解调器。我们即将推出5G，因此不需要像gif压缩或压缩这样的代码压缩。但是，结果我们向后发送了大量的脚本给客户。那为什么要最小化任何东西呢？

— 斯托克利

1

因为我们应该尽可能少地发送电汇？我当然会尽量减少事情。

— Scott Fraley

0

我做了所有必要的事情以将捆绑添加到MVC 3网站（我是现有解决方案的新手）。 Styles.Render没有为我工作。我终于发现我只是想念一个冒号。在母版页：<%: Styles.Render("~/Content/Css") %> 我仍然搞不清楚为什么（在同一页面上）<% Html.RenderPartial("LogOnUserControl"); %>的作品没有冒号。

— dudeNumber4
source