ubuntu jekyll_如何在Ubuntu 20.04上设置Jekyll开发站点

ubuntu jekyll

介绍 (Introduction)

If you’re looking to build a static website or blog quickly, Jekyll could be a great solution. An open-source static-site generator written in Ruby, Jekyll allows for quick execution of commands that help manage your site from initial to production deployment, all from your command line. Jekyll is blog-aware, giving priority to categories, posts, and layouts with a range of importers available to import previous blog content. If you need to work offline often, prefer using lightweight editors to web forms for content maintenance, or wish to use version control to track changes to your website, Jekyll could provide you with what you need to accomplish your goals.

如果您想快速建立一个静态网站或博客，Jekyll可能是一个很好的解决方案。 Jekyll是一个用Ruby编写的开源静态站点生成器，它允许快速执行命令，这些命令可以从命令行到初始部署到生产部署全程管理。 Jekyll具有博客意识，优先考虑类别，帖子和布局，并具有一系列可用于导入先前博客内容的导入器。 如果您需要经常脱机工作，更喜欢使用轻量级编辑器来维护内容的Web表单，或者希望使用版本控制来跟踪网站的更改，Jekyll可以为您提供实现目标所需的一切。

In this tutorial, we will install a Jekyll development site on Ubuntu 20.04 with automatically-generated content. With Jekyll installed, you’ll be able to create a personal site or blog primarily using markdown files and a few Jekyll commands.

在本教程中，我们将在Ubuntu 20.04上安装具有自动生成内容的Jekyll开发站点。 安装了Jekyll后，您将能够主要使用markdown文件和一些Jekyll命令创建个人站点或博客。

先决条件 (Prerequisites)

To follow this tutorial, you will need:

要遵循本教程，您将需要：

• An Ubuntu 20.04 server with a non-root user with sudo privileges: You can learn more about how to set up a user with these privileges in our Initial Server Setup with Ubuntu 20.04 guide.

  具有具有sudo特权的非root用户的Ubuntu 20.04服务器 ：您可以在我们的《 Ubuntu 20.04初始服务器设置》指南中了解有关如何设置具有这些特权的用户的更多信息。

Once you’ve completed this prerequisite, you’re ready to install Jekyll and its dependencies.

完成此先决条件后，就可以安装Jekyll及其依赖项了。

第1步-安装Jekyll (Step 1 — Installing Jekyll)

We’ll start by updating our package list to be sure we have the latest information on the newest versions of packages and their dependencies:

我们将从更新软件包列表开始，以确保我们拥有有关软件包的最新版本及其依赖项的最新信息：

• sudo apt update
  sudo apt更新

Next, let’s install make and build-essential so that Jekyll’s libraries will compile, and for Ruby and its development libraries to use. We include the y flag here to confirm that yes, we would like to install the packages and avoid the prompt to confirm.

接下来，让我们安装make和build-essential以便可以编译Jekyll的库，并供Ruby及其开发库使用。 我们在此处包括y标志，以确认是的，我们想安装软件包并避免提示您进行确认。

• sudo apt -y install make build-essential ruby ruby-dev
  须藤apt -y install make build-essential ruby​​ ruby​​-dev

When that’s complete, let’s add two lines to our .bashrc file to tell Ruby’s gem package manager to place gems in our user’s home folder. This avoids problems occurring from system-wide installations while also adding the local jekyll command to the user’s PATH.

完成后，让我们在.bashrc文件中添加两行，以告诉Ruby的gem软件包管理器将gems放置在用户的主文件夹中。 这样可以避免由于系统范围的安装而引起的问题，同时还可以将本地jekyll命令添加到用户的PATH 。

Open .bashrc with an editor of your choice, such as nano:

使用您选择的编辑器打开.bashrc ，例如nano：

• nano .bashrc
  纳米.bashrc

At the bottom of the file, add the following lines:

在文件的底部，添加以下行：

.bashrc

.bashrc

# Ruby exports

export GEM_HOME=$HOME/gems
export PATH=$HOME/gems/bin:$PATH

Save and close the file. To activate the exports, run the following:

保存并关闭文件。 要激活导出，请运行以下命令：

• source ~/.bashrc
  来源〜/ .bashrc

When that’s complete, we’ll use gem to install Jekyll itself as well as Bundler, which manages gem dependencies. Note that this may take some time.

完成后，我们将使用gem来安装Jekyll本身以及用于管理gem依赖项的Bundler。 请注意，这可能需要一些时间。

• gem install jekyll bundler
  gem install jekyll捆绑器

Next, we’ll make sure that our firewall settings allow traffic to and from Jekyll’s development web server.

接下来，我们将确保我们的防火墙设置允许往返于Jekyll开发Web服务器的流量。

第2步-打开防火墙 (Step 2 — Opening the Firewall)

Let’s check whether the firewall is enabled. If so, we’ll ensure traffic to our site is permitted so we will be able to view our development site in a web browser.

让我们检查防火墙是否启用。 如果是这样，我们将确保允许访问我们网站的流量，以便我们能够在Web浏览器中查看我们的开发网站。

• sudo ufw status
  sudo ufw状态

If you’ve encountered a status showing inactive, run the following commands.

如果遇到状态显示inactive ，请运行以下命令。

ufw allow OpenSSH
sudo ufw enable

This will enable your firewall to run on system startup. You may get the following prompts (confirm with ‘y’ to continue):

这将使您的防火墙能够在系统启动时运行。 您可能会收到以下提示(单击“ y”确认以继续)：

Command may disrupt existing ssh connections. Proceed with operation (y|n)? y
Firewall is active and enabled on system startup

In our case, only SSH is allowed through:

在我们的情况下，仅允许通过以下方式使用SSH：

   
   

    
    Output
   
   
Status: active
To Action  From
-- ------  ----
OpenSSH ALLOW   Anywhere
OpenSSH (v6)   ALLOW   Anywhere (v6)

You may have other rules in place or no firewall rules at all depending on how you have set up your firewall. Since only SSH traffic is permitted in this case, we’ll need to open port 4000, the default port for the Jekyll development server:

您可能有其他规则，也可能根本没有防火墙规则，这取决于您如何设置防火墙。 由于在这种情况下仅允许SSH通信，因此我们需要打开端口4000，这是Jekyll开发服务器的默认端口：

• sudo ufw allow 4000
  须藤ufw允许4000

Now our firewall rules should include the following:

现在，我们的防火墙规则应包括以下内容：

   
   

    
    Output
   
   
To                         Action      From
--                         ------      ----
OpenSSH                    ALLOW       Anywhere
4000                       ALLOW       Anywhere
OpenSSH (v6)               ALLOW       Anywhere (v6)
4000 (v6)                  ALLOW       Anywhere (v6)

Now with the software installed and the necessary port open, we’re ready to create the development site.

现在，在安装了软件并打开了必要的端口之后，我们就可以创建开发站点了。

步骤3 —创建一个新的开发站点 (Step 3 — Creating a New Development Site)

From our home directory, we’re using Jekyll’s new command to create scaffolding for a site in a subdirectory called www:

在主目录中，我们使用Jekyll的new命令在名为www的子目录中为网站创建脚手架：

• cd ~
  光盘〜

• jekyll new www

  jekyll新www

The jekyll new command initiates a bundle install to install the required dependencies, then automatically installs a theme called Minima. Following a successful installation, you should receive output like the following:

jekyll new命令启动bundle install以安装所需的依赖项，然后自动安装名为Minima的主题。 成功安装后，您应该收到如下输出：

   
   

    
    Output
   
   
New jekyll site installed in /home/sammy/www.

Jekyll’s new command creates the following directories and files:

Jekyll的new命令将创建以下目录和文件：

...
├── 404.html
├── about.markdown
├── _config.yml
├── Gemfile
├── Gemfile.lock
├── index.markdown
├── _posts
│   └── 2020-05-29-welcome-to-jekyll.markdown
└── _site

These aren’t the actual web site files. They are the source files that Jekyll will use to create the static site. Jekyll relies on specific names, naming patterns, and directory structures to parse the different sources of content and assemble them into a static site. It’s important to use the existing structure and follow Jekyll’s naming conventions when adding new posts and pages.

这些不是实际的网站文件。 它们是Jekyll将用来创建静态站点的源文件。 Jekyll依靠特定的名称，命名模式和目录结构来解析不同的内容源并将它们组合到一个静态站点中。 添加新的帖子和页面时，使用现有结构并遵循Jekyll的命名约定非常重要。

Tip: tree is a useful command for inspecting file and directory structures from the command-line. You can install it with the following command:

提示： tree是用于从命令行检查文件和目录结构的有用命令。 您可以使用以下命令进行安装：

• sudo apt install tree
  sudo apt安装树

To use it, cd into the directory you want and type tree or provide the path to the starting point with tree /home/sammy/www

要使用它，请将cd插入所需的目录，然后键入tree或使用tree /home/ sammy /www提供起点的路径

步骤4 —启动Jekyll的Web服务器 (Step 4 — Starting Jekyll’s Web Server)

Jekyll’s built-in lightweight web server is tailored to support site development by monitoring the files in the directory and automatically regenerating the static site any time a change is saved.

Jekyll的内置轻量级Web服务器经过定制，可通过监视目录中的文件并在保存更改时自动重新生成静态站点来支持站点开发。

Because we are working on a remote server, we’ll specify the host address in order to browse the site from our local machine. If you are working on a local machine, you can run jekyll serve without the host setting and connect with http://localhost:4000.

因为我们正在使用远程服务器，所以我们将指定主机地址，以便从本地计算机浏览站点。 如果在本地计算机上工作，则可以在没有主机设置的情况下运行jekyll serve并使用http://localhost:4000 。

• cd ~/www
  cd〜/ www

• jekyll serve --host=203.0.113.0

  jekyll服务--host = 203.0.113.0

   
   

    
    Output of jekyll server
   
   
Configuration file: /home/sammy/www/_config.yml
            Source: /home/sammy/www
       Destination: /home/sammy/www/_site
 Incremental build: disabled. Enable with --incremental
      Generating...
                    done in 0.645 seconds.
 Auto-regeneration: enabled for '/home/sammy/www'
    Server address: http://203.0.113.0:4000/
  Server running... press ctrl-c to stop.

When we invoked jekyll serve, Jekyll parsed the configuration and content files into a new directory, _site and started serving the content in that _site folder:

当我们调用jekyll serve ，Jekyll将配置和内容文件解析到新目录_site并开始在该_site文件夹中提供内容：

...
├── 404.html
├── about.markdown
├── _config.yml
├── Gemfile
├── Gemfile.lock
├── index.markdown
├── _posts
│   └── 2020-05-29-welcome-to-jekyll.markdown
└── _site
    ├── 404.html
    ├── about
    │   └── index.html
    ├── assets
    │   ├── main.css
    │   │   ├── main.css.map
    │   └── minima-social-icons.svg
    ├── feed.xml
    ├── index.html
    └── jekyll
        └── update
            └── 2020
                └── 05
                    └── 29
                        └── welcome-to-jekyll.html

It also started watching the current directory, www, for changes. As soon as a change to a post or page is saved, the static site will automatically be rebuilt, so it’s important not to make changes directly to files in the _site folder.

它还开始监视当前目录www的更改。 一旦保存对帖子或页面的更改，静态站点将自动重建，因此，重要的是不要直接对_site文件夹中的文件进行更改。

If we leave this terminal open with the development server running in the foreground when working on our site, we’ll receive immediate feedback as we add pages and posts and change content.

如果在我们的网站上工作时，使该终端保持打开状态，并且开发服务器在前台运行，则在添加页面和帖子以及更改内容时，我们将立即收到反馈。

Note: If you’re working with a large site, enabling the --incremental build can speed up the rebuild each time you make a change by only regenerating the files that are changed, but we don’t need it for this small site. You can learn more about this experimental feature on the Jekyll website.

注意：如果您使用的是大型站点，则启用--incremental构建可以在每次进行更改时通过仅重新生成已更改的文件来加快重建速度，但是对于该小型站点，则不需要。 您可以在Jekyll网站上了解有关此实验功能的更多信息。

The site is now available. In a web browser, we can visit it at the server address and port shown in the the output from jekyll serve:

该站点现已可用。 在Web浏览器中，我们可以通过jekyll serve输出中显示的服务器地址和端口访问它：

结论 (Conclusion)

In this tutorial, we installed Jekyll and created a development site with some automatically-generated content. You can learn more about Jekyll by reading our other tutorials on the subject:

在本教程中，我们安装了Jekyll，并使用一些自动生成的内容创建了一个开发站点。 您可以通过阅读有关该主题的其他教程来了解有关Jekyll的更多信息：

• Exploring Jekyll’s Default Content

  探索Jekyll的默认内容

• How To Control URLs and Links in Jekyll

  如何在Jekyll中控制URL和链接

翻译自: https://www.digitalocean.com/community/tutorials/how-to-set-up-a-jekyll-development-site-on-ubuntu-20-04

ubuntu jekyll