无法在Github页面中部署Blogdown制作的网站 [英] Cannot deploy website made by Blogdown in Github Pages

问题描述

我想部署一个使用Github页面中的blogdown包创建的基于Hugo的网站，同时将该网站的R源代码保存在相同的存储库中。这应该可以通过在Github存储库中的docs目录中生成网站文件，然后将Github页面指向main分支中的docs文件夹来实现。然而，我无法使其工作。

在这里，我描述一个简单的博客站点来演示这个问题。该目录是使用RStudio创建的，选项如下图所示。

我已经编辑了config.toml文件，特别是将publishDir设置为docs，并为网站添加了一个徽标。编辑后的config.toml文件的内容如下所示。

baseurl = "/"
publishDir = "docs"
languageCode = "en-us"
title = "Blogdown website in Github Pages"
theme = "hugo-lithium"
googleAnalytics = ""
disqusShortname = ""
ignoreFiles = ["\.Rmd$", "\.Rmarkdown$", "_files$", "_cache$"]

[permalinks]
    post = "/:year/:month/:day/:slug/"

[[menu.main]]
    name = "About"
    url = "/about/"

[params]
    description = "Demonstrating problem in deploying a blogdown website in Github Pages."

    # options for highlight.js (version, additional languages, and theme)
    highlightjsVersion = "9.12.0"
    highlightjsCDN = "//cdnjs.cloudflare.com/ajax/libs"
    highlightjsLang = ["r", "yaml"]
    highlightjsTheme = "github"

    MathJaxCDN = "//cdnjs.cloudflare.com/ajax/libs"
    MathJaxVersion = "2.7.5"

    [params.logo]
    url = "logo.png"
    width = 50
    height = 50
    alt = "Logo"

我还将netlify.toml文件中publish参数的值编辑为docs。我这样做是为了选择使用Netlify部署网站，而不是Github页面。编辑后的netlify.toml文件内容为：

[build]
command = 'hugo'
publish = 'docs'
[build.environment]
HUGO_VERSION = '0.89.4'


[context]
[context.branch-deploy]
command = 'hugo -F -b $DEPLOY_PRIME_URL'

[context.deploy-preview]
command = 'hugo -F -b $DEPLOY_PRIME_URL'

[context.production]
[context.production.environment]
HUGO_ENV = 'production'

网站内容被添加到content文件夹中，该文件夹包括about.md文件和2021-12-09-sample-post.Rmd示例帖子。content文件夹的结构为：

content
   |-- about.md
   |-- post
        |-- 2021-12-09-sample-post.Rmd

通过将文件logo.png放在staticimages目录中来添加徽标。该示例的源代码可以从here下载。RStudio中的本地构建运行得非常好。本地搭建网站后的文件上传here。我已将.nojekyll文件放在main目录和docs文件夹中，以防止Github页面使用Jekyll。

但是，生成的Github页面站点does not work。但it works perfectly in Netlify。

我还尝试将文件config.toml中的baseurl参数的值更改为指向Github托管目录。该网站是在RStudio中通过Bloomdown完美生成的。上传源代码以及生成的网站文件here。但现在，neither Github Pagesnor Netlify已正确部署网站。

我希望能够在Github页面和Netlify中部署网站，就像使用R中的bookdown包生成的网站可以做到的一样。如果这根本不可能，我希望至少能够在Github页面中部署网站。我想知道我在网站代码或配置中犯了什么错误。

推荐答案

简明答案：在config.toml中设置relativeURLs = true，以便您的页面使用相对URL(但这实际上取决于主题对相对URL的支持；hugo-lithium主题应该很好)。

更长的答案：

您的Github页面URLhttps://joydeepchowdhury.github.io/deploymentproblem/包含子路径deploymentproblem/，而您的Netlify URL不包含：https://deploymentproblem.netlify.app/。如果您不使用相对URL，这两个站点中的一个站点上的资源加载将不正确，例如https://joydeepchowdhury.github.io/deploymentproblem/上的/images/logo.png表示https://joydeepchowdhury.github.io/images/logo.png，这是错误的(应该是https://joydeepchowdhury.github.io/deploymentproblem/images/logo.png)，但在Netlify站点上是正确的：https://deploymentproblem.netlify.app/images/logo.png。绝对/相对URL很难理解，但理解起来却极其重要。您可以阅读博客一书Appendix B.1的最后部分。

另一种解决方案是为不同的站点指定不同的。例如，您可以配置

baseURL: "https://joydeepchowdhury.github.io/deploymentproblem/"

在config.toml中，但在netlify.toml中覆盖它：

[build]
command = 'hugo -b https://deploymentproblem.netlify.app/'

这篇关于无法在Github页面中部署Blogdown制作的网站的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！