将Jekyll部署到Github Pages

Question

我使用Jekyll在本地构建了一个站点，并将其推送到新的主仓库（username.github.com），这个站点运行良好。我的问题是，如何将可部署的部分——_site目录，或者更确切地说，该目录的内容——移动到gh-pages分支中？

我计划使用自定义域名。我的工作流程将是在主分支中工作，可能还会有一些功能分支，然后将编译结果推送（合并）到gh-pages分支。这样做正确吗？

我很难通过文档弄清楚它，感谢任何帮助，谢谢！

- thatryan

Answer 1

根据您的问题细节，您的工作流似乎不正确。

如果您已将基于Jekyll的网站推送到username.github.io存储库，则不需要gh-pages分支。只有在想要在同一存储库中拥有代码和网站的存储库中才需要gh-pages分支。无论哪种情况，GitHub Pages都会为您运行Jekyll并提供编译站点服务。

为了保持安全，GitHub Pages确实以非常特定的方式运行Jekyll。如果您正在使用自定义插件与Jekyll网站，请将编译的站点（您提到的_site目录）存储在主分支上，源代码存储在另一个分支上。

总之，您的工作流程应该在本地存储库中进行-可以是主分支或功能分支（根据需要将功能分支合并到本地主分支中）-当您准备发表时，将本地存储库推送到GitHub上的主分支。

- mattr-

Answer 2

您应该在开发或功能分支上工作，然后仅将构建文件推送到主分支以便由Github Pages提供服务。

要做到这一点：

1. 在您的 development 分支中开始，所有更改都已准备好进行构建并发布。
2. 在您的开发分支中运行： rm -rf _site （这将删除旧的构建文件到 _site 文件夹）
3. 运行 git clone -b master 'git config remote.origin.url' _site（这将为您的构建文件创建一个主分支）
4. 运行 jekyll build（构建您的网站）
5. cd _site
6. 如果您有自定义域，请执行第7-8步，否则跳至第9步
7. touch CNAME
8. 将您的自定义域添加到该CNAME文件中
9. git add .（现在你应该在master/_site分支中）
10. git commit
11. git push

现在，只有您的构建文件应该位于 master, 您的工作文件将位于您的development或功能分支中！

我曾经为此苦苦挣扎，因此编写了一个脚本，如果您想使用它：https://github.com/andimiya/deploy-jekyll-gh-pages

- andimiya

Answer 3

你想要做的事情很像Octopress的工作方式。让我解释一下你如何做类似的事情。

你想部署位于_site中的数据到gh-pages分支。因此，你的第一步是将存储库username.github.com的默认分支设置为gh-pages，而不是master或source（基本上根据你的意愿）。现在你需要在Rakefile中编写任务，将_site的内容复制到gh-pages分支。完成后，你可以自动化push过程，也可以手动完成。这样，GitHub在你push默认分支时将不会构建你的网站，而是只提供_site中存在的静态页面。

如果你想了解脚本的工作原理，应该查看Octopress中的Rakefile。它有两个被称为generate和deploy的任务。运行rake generate时，它将使用参数将代码放入名为_deploy的目录中，并在运行rake deploy时将_deploy的内容复制到gh-pages分支并进行提交。个人而言，我很喜欢这个过程，但我没有在我的Jekyll网站中实现它。

- Aniket

Answer 4

尝试使用我的jgd宝石。您只需要安装并运行以下命令即可：

gem install jgd
jgd

完成了！您的站点已经构建并部署到gh-pages。同时，jgd与travis-ci或其他任何CI服务器完美集成。

本文详细解释了机制：http://www.yegor256.com/2014/06/24/jekyll-github-deploy.html

- yegor256

Answer 5

您不希望更改文件夹_site中的任何文件。 _site是Jekyll保存其生成的静态HTML页面的位置。下次Jekyll服务器重新生成站点时，它们将被自动覆盖。例如，如果您创建了一个新的博客文章，服务器会看到新文件（或更新的文件），然后使用其中的新内容重新生成静态页面。这就是您的新博客文章位于页面顶部的方式。

将_site添加到您的.gitignore文件中被认为是最佳实践。没有必要将该目录推送到您的repo中，因为一旦它们到达github的服务器，它们就会被覆盖。

我认为您想要做的是checkout一个新分支，进行更改，然后将其合并到gh-pages分支中。

- akajut

Answer 6

尽管GitHub页面可以自动构建，但您只能将静态文件部署到gh-pages分支。这样做的主要目的是运行第三方插件。为此，我创建了一个脚本来帮助执行此操作。

如果您想下载脚本，请单击此处。

此脚本的作用是：

默认文件夹名称： BUILD_FOLDER='_site' PUSH_FOLDER='_site_ghpages'

它会执行以下操作：

1.在PUSH_FOLDER中创建一个具有设置名称的文件夹。如果该文件夹已存在，则清空它； 2.更改目录到PUSH_FOLDER（cd $PUSH_FOLDER）; 3.仅克隆GitHub的远程gh-pages分支到PUSH_FOLDER； 4.将BUILD_FOLDER的所有内容复制到PUSH_FOLDER； 5.将PUSH_FOLDER的所有文件添加到本地gh-pages分支，提交并推送到远程gh-pages； 6.返回到先前的目录。

如何使用该脚本：

首先确保：

1.在.gitignore文件中忽略PUSH_FOLDER； 2.在您的存储库中已经创建了名为“gh-pages”的分支（运行脚本后，此分支将仅包含构建文件夹的静态文件）。

要执行脚本，首先应允许其在您的计算机上作为可执行文件运行。要执行此操作，请使用Bash/Git Bash运行：

chmod +x push_ghpages.sh

之后只需运行调用该文件：

. push_ghpages.sh

当不带参数调用此脚本时，将使用“自动提交”消息进行提交。 因此，如果您想设置提交消息，请将其作为参数传递，例如：

. push_ghpages.sh "Your commit message goes here."

如果执行时遇到任何问题，只需删除PUSH_FOLDER，清空远程gh-pages并让脚本重新构建并推送内容。

此外，请进入PUSH_FOLDER目录（用命令“cd my_push_folder_directory”），并运行“git branch”命令检查是否仅有gh-pages分支，如果存在master分支或其他分支，则将其删除。

#! /bin/bash
# Author: [e-mail]
# This is a script used to automatically deploy a Jekyll website/blog with third party plugins to GitHub Pages.

BUILD_FOLDER="_site";
PUSH_FOLDER="_site_ghpages"; 
COMMIT_MESSAGE=$1

#Remove all the content from the "PUSH_FOLDER".
function removeAllContentFromPushFolder(){
    rm -r $PUSH_FOLDER/*;
}

#Create the folder "PUSH_FOLDER".
function createFolderToPush(){
    mkdir $PUSH_FOLDER
}

#Copy all the content from the folder _site to PUSH_FOLDER.
function copySiteToFolder(){
    cp -r $BUILD_FOLDER/. $PUSH_FOLDER
}

#Clone only the branch "gh-pages" to the folder "PUSH_FOLDER". 
function cloneGhpages(){
    git clone --branch gh-pages `git config remote.origin.url` $PUSH_FOLDER
}

function prepareThePushFolder(){
    if [[ -d ./$PUSH_FOLDER ]]
    then
        #Remove all the content from the folder "PUSH_FOLDER".
        removeAllContentFromPushFolder
    else
        #Create the folder "PUSH_FOLDER" if it doesn't exist.
        createFolderToPush
        #Call the function that clone the branch "gh-pages" to the folder "PUSH_FOLDER". 
        cloneGhpages
        #Remove any prevous content from the folder "PUSH_FOLDER".
        removeAllContentFromPushFolder

    fi
    #Call the function that copy all the content from the folder _site to "PUSH_FOLDER".
    copySiteToFolder
}

function changeDirectoryToGhpages(){
    cd $PUSH_FOLDER
}

function setMessageCommit(){
    if ! [ "$COMMIT_MESSAGE" ]
    then
      COMMIT_MESSAGE='Automatic Commit'
    fi
}

function pushBranchGhpages(){
    git add .
    git commit -m "$COMMIT_MESSAGE"
    git push
}

function changeDirectoryBack(){
   cd ..
}

prepareThePushFolder
changeDirectoryToGhpages
setMessageCommit
pushBranchGhpages
changeDirectoryBack

- Kleber Germano