Jekyll 搭建静态网站

本文最后更新于:2022年9月20日 下午

Jekyll 是一个简单的免费的静态网页生成工具,不需要数据库支持,可以配合第三方服务,可以免费部署在 Github 上,而且可以绑定自己的域名。

简介

  • Jekyll 是一个简单的博客形态的静态站点生产机器。它有一个模版目录,其中包含原始文本格式的文档,通过一个转换器(如 Markdown)和我们的 Liquid 渲染器转化成一个完整的可发布的静态网站,你可以发布在任何你喜爱的服务器上。Jekyll 也可以运行在 GitHub Page 上,也就是说,你可以使用 GitHub 的服务来搭建你的项目页面、博客或者网站,而且是完全免费的。
  • 官方网站:http://jekyllcn.com/
  • 中文文档:https://www.wenjiangs.com/doc/jekyll-home

依赖

安装 Jekyll 相当简单,但是你得先做好一些准备工作。开始前你需要确保你在系统里已经有如下配置。

  • Ruby(including development headers, Jekyll 2 需要 v1.9.3 及以上版本,Jekyll 3 需要 v2 及以上版本)
  • RubyGems
  • NodeJS, 或其他 JavaScript 运行环境(Jekyll 2 或更早版本需要 CoffeeScript 支持)。
  • Python

安装方法

安装 Ruby

  • 下载后安装,注意Ruby 的安装路径不能有空格,类似 Program Files 这种地方是不可以的
  • 之后会自动配置一些东西 MSYS2.

  • 测试,执行 gem -v 能看到版本说明 Ruby 安装成功
1
2
$ gem -v
3.2.33

安装 Jekyll

  • 执行命令
1
gem install jekyll bundler

创建 Demo

  • 执行命令
1
2
3
4
5
jekyll new my-awesome-site
cd my-awesome-site
bundle install
bundle add webrick # 如果 Ruby 3+ 需要执行此命令
bundle exec jekyll serve

更换主题

  • Jekyll 支持很多主题,列表
  • 我们以 jekyll-theme-yat 主题 为例

  • Gemfile 文件添加:
1
gem "jekyll-theme-yat"
  • _config.yml 文件添加
1
theme: jekyll-theme-yat
  • 执行命令渲染:
1
bundle
  • 运行服务
1
bundle exec jekyll serve

参考资料


Jekyll 搭建静态网站
https://www.zywvvd.com/notes/tools/jekyll/usage/
作者
Yiwei Zhang
发布于
2022年9月20日
许可协议