最近在做Jekyll项目。第一次接触这种技术,简单说就是一种创建并生成静态网站的工具。基本功扎实的,敲好代码(用Git来管理代码,建立独立工作分支),现在情况是想要在web上看一下效果,因为一些问题在本地开发环境下可能发现不了。
这里使用GitHub Pages来实现。有关资料请看官网。
说一些自己在部署项目到 GitHub上遇到的问题和解决办法。
1. site.url vs site.baseurl
如果已经看了官网资料,就知道为了用 GitHub Pages 看项目网站,必须将 site.baseurl 的值设为这种形式/project-name. 至于如何处理JS、CSS or Images 资源的路径,我采用这种形式{{ site.url }}{{ site.baseurl }}/path/to/css.css, 而site.url 设为 “” (空),理由是
- 本地运行使用官网推荐的 jekyll serve --baseurl ‘’, 此时两个变量尽管都是empty string,但是 jekyll serve 仍然可以让你在 localhost:4000 地址查看网站。注意,如网站logo超链接地址一定要在末尾写上斜杠 <a href="{{ site.url }}{{ site.baseurl }}/">,这样即使两个变量为空,地址是 “/” 就是root path。确保链接导向正确。
- 在GitHub Pages上,因为 url 为空,baseurl符合要求,nothing special need to do, 就可以正确显示。
- 项目最终是要放在互联网上的,到时候只需要在 _config.yml 文件里把 site.url 设为网站地址,如 http://www.example.com, 而把site.baseurl 设为 空
2. deploy Jekyll to GitHub Pages
1. 直接在自己的GitHub个人主页 Repositories 分页里,点 New,填写 Repository name (也就是 project-name 注意值要和 site.baseurl 一样),简单填写一些Description,点击 Create repository。OK!
2. terminal里到工作分支下,运行 git remote add originremote_repository_URL 补充一下:不知道 remote_repository_URL 的可以运行git remote -v 来查看
3. 确定代码没问题了,修改一下工作分支名字 git branch -m gh-pages,因为官方说了网站内容必须存放在名为gh-pages 的分支下才行。换言之,用于项目的 GitHub Pages 的默认分支是gh-pages。相对于个人页面 username.github.io 的默认分支必须是master (最终要展现的代码必须合并到此分支上)而言。
4. 好啦,现在终于可以把代码推上去了。git push origin gh-pages
本文介绍了如何使用Jekyll创建静态网站并在GitHub Pages上进行部署的过程。重点讲述了配置site.url和site.baseurl的方法,以及在本地和GitHub Pages上正确显示网站资源的技巧。此外,还分享了部署过程中的一些常见问题及其解决方案。

被折叠的 条评论
为什么被折叠?



