css - 如何相对化 Hakyll 中 css 文件中的 URL？

Question

在我的 Hakyll 站点中，我有一个链接到页面的样式表:

<link rel="stylesheet" type="text/css" href="/css/my.css">

此 CSS 包含 @font-face链接到字体文件的指令:

@font-face {
 font-family: "Bla";
 src: url("/data/bla.ttf") format("truetype");
}

问题是字体的 URL 没有被 relativizeUrls 相对化即使我将它移到 <script> 中页面本身内的标记。如何解决这个问题？

Answer 1

tl;dr – 您可以使用 Beerend Lauwers 的 hakyll-extra 包(似乎还没有在 hackage 上)，它提供了一个 relativizeUrl宏。或者，按如下方式实现您自己的:

如果您没有太多链接，并且不想仅仅为了执行此操作而引入 CSS 解析器，您可以只创建一个函数字段 - 实际上是一个宏 - 它允许您调用，例如relativize("/some/url")从页面内。 (我遇到了类似的问题，因为我想将指向样式表的链接相对化，仅供旧版本的 Internet Explorer 使用；对于 TagSoup ，链接看起来好像在评论中，所以它没有处理它们.)

首先，我们需要写一个版本relativizeUrls它仅对单个 URL 进行操作:

 import Data.List as L

 -- | Relativize URL. Same logic as "relativizeUrlsWith" in
 -- Hakyll.Web.Html.RelativizeUrls, but for just one url.
 relativizeUrl :: String  -- ^ Path to the site root
                    -> String  -- ^ link to relativize
                    -> String  -- ^ Resulting link
 relativizeUrl root = rel
   where
     isRel :: String -> Bool
     isRel x = "/" `L.isPrefixOf` x && not ("//" `L.isPrefixOf` x)
     rel x   = if isRel x then root ++ x else x

然后，我们定义一个可以添加到上下文中的“功能字段”。

 import Data.Maybe (maybe)

 -- ugh. ugly name.
 relativizeFuncField :: Context a
 relativizeFuncField = functionField "relativize" relativize
   where 
     relativize :: [String] -> Item a -> Compiler String
     relativize args item = do
       siteRoot <- getRoot <$> (getRoute $ itemIdentifier item)
       arg <- case args of 
               [arg] -> return arg
               _     -> error "relativize: expected only 1 arg"
       return $ relativizeUrl siteRoot arg

     getRoot :: Maybe String -> String
     getRoot = maybe (error "relativize: couldn't get route") toSiteRoot 

然后，任何您想使用此宏的地方，而不是使用，比方说，defaultContext , 使用 relativizeFuncField <> defaultContext .例如:

 import Data.Monoid( (<>) )

 main = 
   -- ... 

   match (fromList ["about.rst", "contact.markdown"]) $ do
       route   $ setExtension "html"
       compile $ pandocCompiler
           >>= loadAndApplyTemplate "templates/default.html" (relativizeFuncField <> defaultContext)
           >>= relativizeUrls

所以，最后，这意味着在一个文件中，你可以写 $relativize("/path/to/file")$在任何地方 TagSoup还没有相对化链接。

希望有用:)
(这是使用 Hakyll 4.9.0.0，但我假设其他 4.X 版本大致相同。)

编辑:附:非常感谢 Beerend Lauwers，他在他的帖子 here 中解释了 Hakyll 函数字段

再次编辑:d'oh。我没看到 Beerend 实际上已经放了一个 relativizeUrl在他的 hakyll-extra 中发挥作用包。