ubuntu16.04本地搭建Jekyll

主要步骤依据Jekyll官网

.tar.gz 格式解压 tar -zxvf xx.tar.gz

.tar.bz2 格式解压 tar -jxvf xx.tar.bz2

具体安装

  1. 安装Ruby

    sudo apt-get install ruby-full
    
  2. 安装RubyGems

    • 下载RubyGems

    • 控制台执行

      1. 解压:unzip  rubygems-2.7.3.zip
      

      官网安装步骤:

      官网安装步骤

  3. 安装NodeJS

    sudo apt-get install node.js
    
  4. Python2.7,一般Linux安装后都会带有Python,使用python --version即可查看版本

    准备工作都做完了,下面继续查看Jekyll的快速指南

遇到的问题

  1. 执行jekyll new myblog时出错

    sudo jekyll new blog
    [sudo] password for itaiit: 
    Running bundle install in /home/itaiit/Documents/blog... 
    jekyll 3.6.2 | Error:  No such file or directory - bundle
    

    解决:

    sudo apt install ruby-bundler
    

    然后再执行:

    jekyll new myblog
    

    接着继续教程执行:

    cd myblog
    jekyll serve
    

    结果:

最终执行效果

打开浏览器访问:localhost:4000

如果觉得主题默认的显示不满意,可以修改主题的默认配置文件,参考minima样式调整

补充(我怎莫找不到模板文件?)

这里的补充的内容或许在自己写了几篇博文后,会对一些文件结构产生困惑,此时再来看会更容易理解

  1. 根据官网的说明(中文官网相比较英文官网来说少了一些条目,其中就包括Themes这重要的一节),当我们使用命令jekyll new <PATH>创建了一个网站的时候,使用的是Minima主题。在该主题中,一些网站的目录(比如:asets,_layouts,_includes,_sass)都被保存在主题的gem中,是在我们新创建的site中看不到的(它们并不是以.开头的隐藏文件或目录,是压根就没在这)。但是,在jekyll加载的时候,这些目录都会被读取。

    你看到的初始的网站的目录应该是这个样子的:

    ├── Gemfile
    ├── Gemfile.lock
    ├── _config.yml
    ├── _posts
    │   └── 2016-12-04-welcome-to-jekyll.markdown
    ├── about.md
    └── index.md
    
  2. 覆盖默认的主题

    上面说,jekyll默认是不显示_layouts等文件的,我们可以使用如下的方法查看到主题的这些目录所在的gem位置:

    bundle show 主题名
    

    在这里是bundle show minima,如图所示:

    cd到该目录下,原来那些隐藏的文件都在这里(恍然大悟):

    终于现在不用迷惑了,我们写文章时,直接使用layout: default时,default.html在哪里的问题。

    在这里列出了目录结构如下:

     ├── LICENSE.txt
     ├── README.md
     ├── _includes
     │   ├── disqus_comments.html
     │   ├── footer.html
     │   ├── google-analytics.html
     │   ├── head.html
     │   ├── header.html
     │   ├── icon-github.html
     │   ├── icon-github.svg
     │   ├── icon-twitter.html
     │   └── icon-twitter.svg
     ├── _layouts
     │   ├── default.html
     │   ├── home.html
     │   ├── page.html
     │   └── post.html
     ├── _sass
     │   ├── minima
     │   │   ├── _base.scss
     │   │   ├── _layout.scss
     │   │   └── _syntax-highlighting.scss
     │   └── minima.scss
     └── assets
         └── main.scss
    

    那如何覆盖呢?

    1. 可以直接将你的_layouts_includes中的文件复制到对应的文件夹下
    2. 在你的site根目录下创建对应的_layouts_includes目录,然后在里面添加自己的文件即可,jekyll会自动覆盖同名的文件,因为在加载时,jekyll会首先去加载我们新创建的site下的内容,后面才去加载该主题默认的文件,文件夹包括:。
      • /asserts
      • /_layouts
      • /_includes
      • /_sass