如何在另一个要点中引用要点样式表？

Question

我创建了一个包含 html 页面和 css 文件的要点。我如何在 html 页面中引用 css 文件？

我尝试了几种方法，但其中 none 似乎有效。 html 页面位于：https://gist.github.com/yuipcheng/943286be35fd690f499d59534281a6c5

查看页面：https://gistpreview.github.io/?943286be35fd690f499d59534281a6c5

Answer 1

gistpreview.github.io loads the html with Javascript by using the Github Gist API. From the source code 它只是写入 html 内容。因此，它不处理可能 link 到其他 css 文件的相对 links。

您需要：

fork gistpreview 项目
在 html 渲染 (document.write) 之后，遍历 link 标签并检查它们是否出现在 [=43= 的 files 字段中] 结果
如果匹配

我已经使用 this fork 测试了上述方法。

要点示例：https://bertrandmartel.github.io/gistpreview.github.io/?943286be35fd690f499d59534281a6c5

之前的代码：

var content = info.files[fileName].content;
document.write(content);

之后的代码：

var content = info.files[fileName].content;
document.write(content);

//load links
var links = document.querySelectorAll("link");
for (let [key, value] of Object.entries(info.files)) {
  for (var i = 0; i < links.length; i++) {
    var href = links[i].getAttribute("href").replace(/^\/|\/$/g, '');
    if (value.filename === href && value.type === "text/css") {
      console.log("load file " + value.filename);
      var style = document.createElement('style');
      style.type = 'text/css';
      style.innerHTML = value.content;
      document.getElementsByTagName('head')[0].appendChild(style);
    }
  }
}

如何在另一个要点中引用要点样式表？

How to reference a gist stylesheet in another gist?

gist

github