Question

我想在Github上使用jekyll主题。所以我克隆了this repository，但它没有包含css文件。

有些代码如下所示：

<link href="{{ "/assets/css/style.css" | prepend: site.baseurl }}" rel="stylesheet">

这些{{和}}是什么？

这些会在我的编辑器中带来错误。消息是“标签开始未关闭”。

我已经尝试了以下内容：

   <link href="assets/css/style.css" rel="stylesheet">

但我想知道为什么我必须这样写下来。

Answer 1

这些{{和}}是HTML代码中的流动语法。 Liquid是Jekyll用于制作动态内容的特定语言。您可以将其视为PHP的替代方案。

此处，您的示例{{ "/assets/css/style.css" | prepend: site.baseurl }}表示insert the string "/assets/css/style.css" prepended with the value of site.baseurl (this variable should be declared in your _confil.yml)。

但表达式中的双引号与HTML代码中的双引号冲突。尝试：

<link href="{{ '/assets/css/style.css' | prepend: site.baseurl }}" rel="stylesheet">

一旦被Jekyll引擎解释，这可能会生成以下HTML代码：

<link href="http:/www.baseurl.of.mysite.com/assets/css/style.css" rel="stylesheet">

液体here的介绍。

因此，您必须使用适当的命令在克隆的存储库上运行jekyll引擎：

jekyll build

这将生成./_site中的HTML页面。或者：

jekyll serve

这将启动测试服务器，并激活HTML页面的自动重新生成，在http://localhost:4000/的导航器中进行预览。

有关jekyll命令的更多信息here。

我假设您首先在the documentation之后的机器中安装了jekyll。

对预览感到满意后，将您的存储库推送到您的github帐户。 GitHub将运行jekyll引擎并在其服务器中生成HTML页面。

鉴于你的用户名是github上的“爆米花”，你可以将你的jekyll文件推送到：

名为“popcorn.github.io”的存储库：这是您的用户网站，位于https://popcorn.github.io/。
如果您有一个现有项目“foo”，请在名为“gh-pages”的分支中推入此存储库（这是github页面的默认分支;您可以使用其他分支，但您必须标记它作为github页面：请参阅下面的教程）：这是您的项目站点，可在https://popcorn.github.io/foo/处获得。

请参阅GitHub tutorial。

Answer 2

它们是Jekyll在构建时插入必要值所使用的扩展点。将它们视为C / C ++预处理器宏。您收到这些错误的原因是：

<link href="{{ '/assets/css/style.css' | prepend: site.baseurl }}"
      rel="stylesheet"> <!-- Use single quotes when put inside double quotes -->

你能解释为什么在html中使用标签{{，}}吗？

2 个答案: