在.NET MVC中，我們可以將CSS保留在Views文件夾中嗎？

Question

我正在使用ASP.Net MVC。 當我將CSS放在Views文件夾中時，它不會加載CSS。 有人可以幫我解決這個問題嗎？

Answer 1

我喜歡每個View文件夾都有一個CSS文件，僅供組織使用。 這樣，我可以在同一目錄中使用html和相應的CSS，而不必使用較大的CSS文件。

這是我的方法：

首先制作了一個“樣式控制器”，它將所有文件合並為一個：

public class StyleController : Controller
{
    [OutputCache(Duration = 86400, VaryByParam = "none")]
    public ActionResult Index()
    {
        var cssFiles = Directory.GetFiles(Server.MapPath("~/Views"), "*.css", 
                                          SearchOption.AllDirectories);
        var sb = new StringBuilder();

        foreach (var cssFile in cssFiles)
        {
            sb.Append(System.IO.File.ReadAllText(cssFile));
            sb.Append(Environment.NewLine);
        }

        return Content(sb.ToString(), "text/css");
    }
}

然后在布局文件中添加對樣式文件的引用

@Styles.Render("~/Style")

這項工作非常適合開發，但是在生產中，我寧願將StyleController的輸出提取到物理文件中並使用捆綁功能（更改行“ @ Styles.Render”）

Answer 2

通過將靜態文件處理程序添加到Views文件夾中的web.config來允許提供這些文件：

  <system.webServer>
    <handlers>
      <remove name="BlockViewHandler"/>
      <add name="JsHandler" path="*.js" verb="*" type="System.Web.StaticFileHandler" />
      <add name="MapHandler" path="*.js.map" verb="*" type="System.Web.StaticFileHandler" />
      <add name="TsHandler" path="*.ts" verb="*" type="System.Web.StaticFileHandler" />
      <add name="CssHandler" path="*.css" verb="*" type="System.Web.StaticFileHandler" />
      <add name="BlockViewHandler" path="*" verb="*" preCondition="integratedMode" type="System.Web.HttpNotFoundHandler" />
    </handlers>
  </system.webServer>

Answer 3

如果檢查Views \\ Web.Config，您會注意到所有HTTP請求都將傳遞到System.Web.HttpNotFoundHandler。

您當然可以通過修改它來“破解”您的出路（當然，強烈建議不要這樣做！），但是您可能會遇到的另一個問題是，您的“ CSS”請求可能會冒被映射到控制器動作的風險（取決於您的路線和網絡服務器設置），因此您還必須修改global.asax.cs上的路由集合

總而言之：要使您到達所需的位置，必須（大量）修改ASP.NET MVC的工作/結構方式，這可能不是一個好主意...

Answer 4

更新：不，看起來好像被阻止了（404）; 看來，您必須將它們保留在外面。 這很有意義，可以與App_Code阻止等相比。

（原始答案）如何在視圖/母版頁中引用CSS？ 您在使用“ /views/foo.css"、"~/views/foo.css"、"foo.css”還是什么？ 回想一下，瀏覽器會認為它位於“ Some / Invented / Path”中，因此您的css分辨率需要相對於該分辨率-“〜/”（應用程序根）是最簡單的。

我現在看一下...

Answer 5

非常感謝您的回答。 問題是Views文件夾中的web.config阻止CSS加載。 現在問題已經解決。