Question

如何在CSS文件中使用Razor？

我正在使用Razor View Engine一段时间，我很想知道在样式表上使用它。我可以在 .cshtml 文件的<style>块中使用Razor，但我想知道我是否可以在外部 .css 文件中使用它（希望有一个 .cscss 格式）。所以我用Google搜索并发现了两件事：

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

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

那么，如何以最低的性能成本在CSS文件中编写Razor，最好是语法高亮？

是否有一个“更完整”的项目？
我可以改进上面的项目来实现缓存/编译吗？如果是这样，怎么样？

作为旁注：
我找到了一个名为RazorJS的项目。它就像我想要的CSS的Javascript版本以及它的缓存支持。我提到这只是为了澄清我的需求。我目前不需要在Javascript中使用Razor，但我想如果我用CSS制作它，用Javascript做同样的事情也不会太难。

Answer 1

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

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>

_{[ note ，如果您收到程序集绑定错误，则可能需要更改扩展类型中的版本号以匹配您的Razor引擎版本。您可以通过查看项目中对System.Web.WebPages.Razor程序集的引用的属性来检查您正在使用的版本。}

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

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" />

动态样式表使用Razor

1 个答案: