动态样式表使用剃刀

如何使用剃刀在CSS文件？动态样式表使用剃刀

我使用Razor View Engine了一段时间，我很好奇使用它的样式表。我可以用剃刀在.cshtml文件<style>块，但我想知道如果我可以用它在外部的.css文件也（想有一个.cscss格式）。所以，我用Google搜索了一下，发现两件事情：

第一个是LESS：“动态样式表语言”。它似乎易于使用和功能强大的所有功能，但我需要Razor-C＃，真的。

第二个是Dynamic CSS Using Razor Engine CodeProject文章，更像我想要的，但它没有缓存或预编译支持（“不支持”，我的意思是作者没有提到这些方面）。我也希望在Visual Studio中有一些语法突出显示，但这是次要的。

所以，我怎么能写在以最小的性能损失CSS文件，最好用语法高亮剃刀？

是否有“更完整”的项目？
我可以提高上述项目达到缓存/编译？如果是这样，怎么样？

作为一个方面说明：
我发现了一个名为RazorJS项目。这就像我想让CSS获得缓存支持的Javascript版本一样。我提到这只是为了澄清我的需求。我目前不需要在Javascript中使用Razor，但是我猜如果我用CSS做出来，用Javascript做同样的事情不会太难。

来源

2012-04-23 Şafak Gür

您一直在讨论语法突出显示这与剃刀无关。它是你的编辑器的Visual Studio。你试图达到什么目的，你为什么要在你的CSS中使用'剃须刀'？ – TJHeuvel 2012-04-23 11:54:42

@TJHeuvel为什么有人想在他们的HTML剃须刀？为什么人们使用服务器端脚本语言？因为他们希望他们的页面是动态的。这样他们可以将数据存储在数据库中而不是HTML文件中。所以我为什么要在我的CSS中使用剃须刀，是因为我希望我的CSS也是动态的。我可能会将设计相关的数据保存在我的数据库中（如背景颜色），并希望在我的css中使用它。至于intellisense，visual-studio就是这个qustion的标签之一。我想知道我能如何（如果可以的话）在css文件中使用razor intellisense，正如我提到的那样，它对我来说只是次要的东西。 – 2012-04-23 12:50:38

@ d4wn：你为什么希望你的CSS是动态的？ SASS/LESS和视图引擎方法之间有相当大的区别，在后一种情况下，您只是发送客户端非缓存的东西，可能只是静态的...：S – 2012-04-23 13:18:10

您可以创建一个自定义视图引擎：

public class CSSViewEngine : RazorViewEngine 
{ 
    public CSSViewEngine() 
    { 
     ViewLocationFormats = new[] 
     { 
      "~/Views/{1}/{0}.cscss", 
      "~/Views/Shared/{0}.cscss" 
     }; 
     FileExtensions = new[] { "cscss" }; 
    } 

    protected override IView CreateView(ControllerContext controllerContext, string viewPath, string masterPath) 
    { 
     controllerContext.HttpContext.Response.ContentType = "text/css"; 
     return base.CreateView(controllerContext, viewPath, masterPath); 
    } 
}

，并在Application_Start自定义扩展注册它：

ViewEngines.Engines.Add(new CSSViewEngine()); 
RazorCodeLanguage.Languages.Add("cscss", new CSharpRazorCodeLanguage()); 
WebPageHttpHandler.RegisterExtension("cscss");

和里面的web.config与生成提供了扩展名相关联：

<compilation debug="true" targetFramework="4.0"> 
    <assemblies> 
     ... 
    </assemblies> 

    <buildProviders> 
     <add extension=".cscss" type="System.Web.WebPages.Razor.RazorBuildProvider, System.Web.WebPages.Razor, Version=3.0.0.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35"/> 
    </buildProviders> 
</compilation>

_{[注，如果你得到你可能需要改变外延式的版本号，以配合您的剃刀引擎版本的程序集绑定错误。您可以通过查看对System.Web.WebPages的引用属性来检查您正在使用的版本。在您的项目剃刀组装件]}

而最后一步是有一些控制器：

public class StylesController : Controller 
{ 
    public ActionResult Foo() 
    { 
     var model = new MyViewModel 
     { 
      Date = DateTime.Now 
     }; 
     return View(model); 
    } 
}

和相应的视图：（~/Views/Styles/Foo.cscss）：

@model AppName.Models.MyViewModel 

/** This file was generated on @Model.Date **/ 

body { 
    background-color: Red; 
}

可能现在被列为布局中的样式：

<link href="@Url.Action("Foo", "Styles")" rel="stylesheet" type="text/css" />

来源

2012-04-23 13:14:32

这正是我所寻找的，谢谢您。我的下一个任务是找到如何让VS为** .cscss **文件做一些语法高亮（＆intellisense），我猜。 – 2012-04-23 17:11:12

@Darin Dimitrov我已复制此代码。当我想在VS中编译（F5）我的asp.net mvc3解决方案时，出现此错误：错误无法确定“〜/ Views/Styles/Test.cscss”的代码语言。 AMS \ AMS \ ASPNETCOMPILER 任何想法为什么？ – elranu 2013-09-19 20:04:55

@Darin，代码真棒，但我想知道如何修改它以服务Less文件，因为这涉及额外级别的解释......想法？ – ekkis 2013-12-03 02:09:16

动态样式表使用剃刀

回答

相关问题