我gh-pages为GitHub正在开发的项目创建了一个分支.
我使用Sublime文本在本地创建网站,我的问题是当它被推送到GitHub时,所有到javascrips,images和css文件的链接都是无效的.
例如,我在脑海中有这个.
<link href="assets/css/common.css" rel="stylesheet">
这在本地工作得很好,但它不适用于GitHub,因为链接未使用存储库名称作为URL的一部分进行解析.
它要求:
http://[user].github.io/assets/css/common.css
什么时候应该要求:
http://[user].github.io/[repo]/assets/css/common.css.
我当然可以将repo名称作为URL的一部分,但这会阻止我的站点在开发期间在本地工作.
知道怎么处理这个吗？
Anu*_*v C 66
你需要使用Jekyll.
从相关文档中逐字复制:
有时在将
gh-pages分支推送到GitHub 之前预览您的Jekyll网站是很好的 .但是,GitHub用于项目页面的子目录式URL结构使URL的正确解析变得复杂.这是一种利用GitHub项目页面URL结构(username.github.io/project-name/)的方法,同时保持在本地预览Jekyll站点的能力.
在
_config.yml,将baseurl选项设置为/project-name- 记下前导斜杠和没有尾部斜杠.在引用JS或CSS文件时,请执行以下操作:
{{ site.baseurl}}/path/to/css.css- 注意紧跟在变量之后的斜杠(在"path"之前).在执行固定链接或内部链接时,请执行以下操作:
{{ site.baseurl }}{{ post.url }}- 请注意,两个变量之间没有斜杠.最后,如果您想在提交/部署使用之前预览您的站点
jekyll serve,请确保将空字符串传递给该--baseurl选项,以便您可以localhost:4000正常查看所有内容 (在开头没有/ project-name):jekyll serve --baseurl ''这样,您可以从localhost上的站点根目录本地预览您的站点,但是当GitHub从
gh-pages分支机构生成您的页面时,所有URL都将从/project-name正确开始并正确解析.
(显然有人在几个月前才发现这一点.)
Iva*_*zak 12
您使用的是哪种浏览器？你确定会发生这种情况吗？因为它不应该.如果在链接中包含相对URL,则会相对于包含该链接的文档的URL解析该URL.换句话说,当你包括
<link href="assets/css/common.css" rel="stylesheet">
在HTML文档中http://www.foo.com/bar/doc.html,链接assets/css/common.css将通过将其附加到HTML文档的URL的前缀而不是路径的最后部分(没有doc.html)来解析,即链接将解析为http://www.foo.com/bar/assets/css/common.css,而不是http://www.foo.com/assets/css/common.css您声明的.
例如,查看Twitter Bootstrap网页的来源:http://twitter.github.io/bootstrap/.注意顶部的样式链接,指定为<link href="assets/css/bootstrap.css" rel="stylesheet">.该链接正确解析为http://twitter.github.io/bootstrap/assets/css/bootstrap.css,即它确实包含回购名称.
这不应该是2016年12月,3年半之后的问题.
请参阅Ben Balter出版的" GitHub页面的相对链接 " :
在GitHub.com上创作Markdown 一段时间后,您已经能够使用相对链接.
(即2013年1月起)
现在,这些链接将在通过GitHub Pages发布时继续有效.
如果您的存储库中有Markdown文件
docs/page.md,并且您想要从该文件链接到docs/another-page.md,则可以使用以下标记执行此操作:
[a relative link](another-page.md)
当您在GitHub.com上查看源文件时,相对链接将继续工作,就像之前一样,但是现在,当您使用GitHub Pages发布该文件时,链接将被静默转换
docs/another-page.html为与目标页面的已发布URL匹配.在幕后,我们使用开源的Jekyll Relative Links插件,默认情况下为所有版本激活.
GitHub页面上的相对链接还考虑
permalink: /docs/page/了文件的YAML前端内容中的自定义永久链接(例如),并在适当时预先添加项目页面的基本URL,以确保链接在任何上下文中继续有效.
不要忘记,自2016年8月起,您可以直接从master分支机构发布您的页面(并不总是gh-pages分支机构)
自2016年12月起,您甚至不需要Jekyll或index.md.简单的降价文件就足够了.
小智 6
你可以放
<base href="/[repo]/">
<head>标签的内部，它可以解决问题。
您还可以通过设置以下内容来改进此解决方案：
<base href="{{ site.baseurl }}/">
然后设置site.baseurl为空字符串以进行本地测试。
| 归档时间： |
|
| 查看次数： |
29947 次 |
| 最近记录： |