如何在 Ubuntu 16.04 上設定和配置 Jekyll 開發站點


在這篇文章中,我們將學習如何設定和配置 Jekyll 開發站點。Jekyll 提供了內容管理系統 (CMS) 的優勢,並具有資料庫驅動站點中出現的效能和安全性。它也被稱為部落格感知,具有處理日期組織內容的功能。它特別適合離線工作的人員,它還提供了一個輕量級的編輯器和內容管理,具有版本控制功能,用於跟蹤對其網站所做的更改。

先決條件

  • 安裝了 Ubuntu 16.04 的機器。
  • 在機器上具有 Sudo 許可權的使用者。

在 Ubuntu 16.04 上安裝 Jekyll 開發站點

在開始實際安裝之前,我們首先將使用以下命令更新系統。

$ sudo apt-get update
Output:
Hit:1 http://in.archive.ubuntu.com/ubuntu xenial InRelease
Get:2 http://in.archive.ubuntu.com/ubuntu xenial-updates InRelease [95.7 kB]
Hit:3 http://security.ubuntu.com/ubuntu xenial-security InRelease
Hit:4 http://in.archive.ubuntu.com/ubuntu xenial-backports InRelease
Fetched 95.7 kB in 1s (58.1 kB/s)
Reading package lists... Done

更新完成後,我們將安裝 Jekyll 所需的依賴項,因為我們需要 Ruby 和開發庫(如 Make 和 GCC)來編譯和安裝 Jekyll。

$ sudo apt-get install ruby ruby-dev make gcc

輸出

Reading package lists... Done
Building dependency tree Reading state information... Done … …
Setting up libgmp-dev:amd64 (2:6.1.0+dfsg-2) ...
Setting up libjs-jquery (1.11.3+dfsg-4) ...
Setting up make (4.1-6) ...
Setting up manpages-dev (4.04-2) ...
Setting up rubygems-integration (1.10) ...
Setting up ruby-dev:amd64 (1:2.3.0+1) ...
Setting up ruby (1:2.3.0+1) ...
Setting up rake (10.5.0-2) ...
Processing triggers for libc-bin (2.23-0ubuntu3) ...

安裝完成後,我們可以安裝 Ruby 的 gem 包以及 Jekyll 作為一個捆綁包。

以下是使用 gem 安裝程式安裝 Jekyll 開發伺服器的命令。

$ sudo gem install jekyll bundler
Fetching: liquid-3.0.6.gem (100%)
Successfully installed liquid-3.0.6
Fetching: kramdown-1.12.0.gem (100%)
Successfully installed kramdown-1.12.0
Fetching: mercenary-0.3.6.gem (100%)
Successfully installed mercenary-0.3.6
..
..
..
Installing ri documentation for rb-inotify-0.9.7
Parsing documentation for listen-3.0.8
Installing ri documentation for listen-3.0.8
Parsing documentation for jekyll-watch-1.5.0
Fetching: bundler-1.13.6.gem (100%)
Successfully installed bundler-1.13.6
Parsing documentation for bundler-1.13.6
Installing ri documentation for bundler-1.13.6
Done installing documentation for bundler after 5 seconds
19 gems installed

配置防火牆以允許 Jekyll

首先,我們將檢查防火牆的狀態,以便在 Web 瀏覽器上允許開發站點。以下是檢查防火牆狀態的命令 -

$ sudo ufw status
Output:
Status: active
To             Action             From
--             ------             ----
22             ALLOW             Anywhere
80             ALLOW             Anywhere
22 (v6)        ALLOW             Anywhere (v6)
80 (v6)        ALLOW             Anywhere (v6)

我們可以看到,只有 SSH 和 WWW 服務已啟用,這意味著允許埠 22 和埠 80,我們需要為 Jekyll 開啟埠 4000,這是 Jekyll 開發伺服器的預設埠。

以下是啟用防火牆上 4000 埠的命令 -

$ sudo ufw allow 4000
Output:
Rule added
Rule added (v6)

現在,我們將檢查防火牆狀態以交叉檢查埠 4000 是否已啟用。

$ sudo ufw status
Output:
Status: active
To          Action       From
--          ------       ----
22          ALLOW        Anywhere
80          ALLOW        Anywhere
4000        ALLOW        Anywhere
22 (v6)     ALLOW        Anywhere (v6)
80 (v6)     ALLOW        Anywhere (v6)
4000 (v6)   ALLOW        Anywhere (v6)

由於開發所需的埠已開啟,我們將建立開發站點。

建立演示開發站點

在我們的主目錄中,我們將在名為 www 的資料夾中為演示站點建立一個腳手架。

$ cd ~
$ jekyll new www
OutPut:
New jekyll site installed in /home/ubuntu/www.
Running bundle install in /home/ubuntu/www...
Fetching gem metadata from https://rubygems.org/...........
Fetching version metadata from https://rubygems.org/..
Fetching dependency metadata from https://rubygems.org/.
Resolving dependencies...
Using public_suffix 2.0.4
Using colorator 1.1.0
Using ffi 1.9.14
Using forwardable-extended 2.6.0
Using sass 3.4.22
Using rb-fsevent 0.9.8
Using kramdown 1.12.0
Using liquid 3.0.6
Using mercenary 0.3.6
Using rouge 1.11.1
Using safe_yaml 1.0.4
Installing minima 2.0.0
Using bundler 1.13.6
Using addressable 2.5.0
Using rb-inotify 0.9.7
Using pathutil 0.14.0
Using jekyll-sass-converter 1.5.0
Using listen 3.0.8
Using jekyll-watch 1.5.0
Using jekyll 3.3.1
Installing jekyll-feed 0.8.0
Bundle complete! 3 Gemfile dependencies, 21 gems now installed.
Use `bundle show [gemname]` to see where a bundled gem is installed.
Post-install message from minima:
----------------------------------------------
Thank you for installing minima 2.0!
Minima 2.0 comes with a breaking change that
renders '<your-site>/css/main.scss' redundant.
That file is now bundled with this gem as
'<minima>/assets/main.scss'.
More Information:
https://github.com/jekyll/minima#customization
----------------------------------------------

這將使用其 Gemfiles 指定預設主題,我們現在將執行 bundle 來安裝主題。

$ cd www
$ bundle install
Output:
Using public_suffix 2.0.4
Using colorator 1.1.0
Using ffi 1.9.14
Using forwardable-extended 2.6.0
…
…
Using jekyll-watch 1.5.0
Using jekyll 3.3.1
Using jekyll-feed 0.8.0
Bundle complete! 3 Gemfile dependencies, 21 gems now installed.
Use `bundle show [gemname]` to see where a bundled gem is installed.

www 的樹結構如下所示 -

.
├── about.md
├── _config.yml
├── Gemfile
├── Gemfile.lock
├── index.md
└── _posts
└── 2016-11-15-welcome-to-jekyll.markdown
1 directory, 6 files

在繼續執行下一步之前,我們需要在 _config.yml 檔案中進行一些配置更改。

$ vi ~/www/_config.yml
Output:
The configuration file will be looks like this
title: Your awesome title
email: your-email@domain.com
description: > # this means to ignore newlines until "baseurl:"
Write an awesome description for your new site here. You can edit this
line in _config.yml. It will appear in your document head meta (for
Google search results) and in your feed.xml site description.
baseurl: "" # the subpath of your site, e.g. /blog
url: "ubuntu-16" # the base hostname & protocol for your site, e.g. http://example.com
twitter_username: jekyllrb
github_username: jekyll
# Build settings
markdown: kramdown
theme: minima
gems:
- jekyll-feed
exclude:
- Gemfile
- Gemfile.lock

我們需要找到以下行,並需要將示例替換為您站點的域名

url: "http://example.com" # the base hostname & protocol for your site, e.g. http://example.com

配置完成後,我們現在啟動 Jekyll 的 Web 伺服器。

啟動 Jekyll 的伺服器

我們需要啟動 Jekyll 的 Web 伺服器,它將透過監視目錄中的檔案來支援站點開發,這還將生成靜態網站,並且每次儲存更改時。

$ jekyll serve --host=192.168.2.117
Output:
Configuration file: /home/ubuntu/www/_config.yml
Configuration file: /home/ubuntu/www/_config.yml
Source: /home/ubuntu/www
Destination: /home/ubuntu/www/_site
Incremental build: disabled. Enable with --incremental
Generating...
done in 0.372 seconds.
Auto-regeneration: enabled for '/home/ubuntu/www'
Configuration file: /home/ubuntu/www/_config.yml
Server address: http://192.168.2.117:4000/
Server running... press ctrl-c to stop.

伺服器執行後,網站正在執行並可以使用 IP 地址或域名訪問,因為這是一個演示站點,我們將從本地 IP 地址訪問它,https://192.168.2.197。在本文中,我們將學習如何設定和配置 Jekyll 並安裝依賴項,以及配置 Jekyll 以設定演示網站,我們還將學習如何啟動 Jekyll Web 伺服器。

更新於: 2020 年 1 月 20 日

83 次檢視

開啟你的 職業生涯

透過完成課程獲得認證

開始
廣告