asp.net - 捆绑 css 有效，但字体未加载

Question

我的 MVC 站点中有以下文件夹结构:

-- Content -- Notebook -- css

-- Content -- Notebook -- fonts

内容直接位于网站的根目录下。在我的 css 文件夹中，我有一个具有相对路径的文件

url('../fonts/fontawesome-webfont.woff?v=4.0.3')

我的包目前看起来像:

bundles.Add(new StyleBundle("~/bundles/Content/Notebook/css").Include(
        "~/Content/Notebook/css/animate.css",
        "~/Content/Notebook/css/font.css",
        "~/Content/Notebook/css/font-awesome.min.css",
        "~/Content/Notebook/css/app.css"
));

这是使用渲染的

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

这适用于CSS文件，但字体文件没有加载，我看到它正在这里寻找它http://localhost/MySite/bundles/Content/fonts/fontawesome-webfont.woff ?v=4.0.3

我看到了，然后尝试将我的包名称更改为

~/Content/Notebook/css

认为如果我从名称中删除“ bundle ”，相对路径也会起作用，但这样做会导致 css 文件无法加载。为什么 css 文件无法加载？如果我将“捆绑”一词重新添加到名称中，它就会再次起作用。另外，您知道如何让字体与 bundle 一起加载吗？

Answer 1

当你这样做时:

url('../fonts/fontawesome-webfont.woff?v=4.0.3')

您通过相对路径引用字体。如果您随后将 CSS 包放在 /bundles/Content/Notebook/css 中，它将在 bundles/content/fonts 中查找，因为这是您的相对路径和浏览器所在位置的组合查看您的 css 文件。

一些可能的选择(任一):

• 更改 bundle 路径:

  bundles.Add(new StyleBundle("~/Content/Notebook/css") ...
  (the reason your css files didn't load when you removed bundles was that you didn't change the name of the stylebundle)
  

  和

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

• 使用绝对路径引用您的字体:

  url('/Content/notebook/fonts/fontawesome-webfont.woff?v=4.0.3')