网站LOGO
公爵书房 | 技术分享
页面加载中
10月4日
网站LOGO 公爵书房 | 技术分享
以指键之轻,承载知识之重
菜单
  • 公爵书房 | 技术分享
    以指键之轻,承载知识之重
    用户的头像
    首次访问
    上次留言
    累计留言
    我的等级
    我的角色
    打赏二维码
    打赏博主
    hugo搭建博客笔记
    点击复制本页地址
    微信扫一扫
    文章二维码
    文章图片 文章标题
    创建时间
  • 一 言
    确认删除此评论么? 确认
  • 本弹窗介绍内容来自,本网站不对其中内容负责。

    hugo搭建博客笔记

    公爵 · 原创 ·
    笔记 · 学习笔记静态博客搭建hugo
    共 3154 字 · 约 2 分钟 · 12
    本文最后更新于2023年09月02日,已经过了31天没有更新,若内容或图片失效,请留言反馈

    使用环境

    • 系统:Debian GNU/Linux 11 x86\_64
    • 宝塔:7.9.0
    • GIt

    安装hugo

    bash 代码:
    apt-get install hugo

    检查是否安装成功

    bash 代码:
    hugo version

    输出下图内容,即安装成功

    创建站点

    bash 代码:
    hugo new site Hugo_blog

    Hugo_blog可以自定义,就是生成的hugo文件夹名字,自此Hugo站点生成完毕。

    主题安装

    可以参阅官网的 themes.gohugo.io 查看可用的主题列表。

    先进入Hugo_blog文件夹,我是放在了/www/wwwroot/Hugo_blog这个路径下

    在生成的Hugo_blog目录下点击终端,

    宝塔会自动用cd指令进入该目录下,先执行初始化指令。

    bash 代码:
    git init

    然后执行获取主题的命令,没有用过Git的可以先去简单安装一下,很简单。

    bash 代码:
    git submodule add https://github.com/budparr/gohugo-theme-ananke.git themes/ananke

    显示done,便是安装好了,最后,先打开config.toml

    将主题添加到站点的配置文件中

    bash 代码:
    theme = "ananke"

    当然也可以用一条指令完成添加

    bash 代码:
    echo 'theme = "ananke"' >> config.toml

    添加内容

    这个时候其实博客已经搭建好了,但为了更好看看效果还是要添加下文章看看效果如何。

    Hugo_blog目录下,终端里,输入一下命令(当然你也可以不用宝塔,直接在终端通过cd指令也行,直接手动创建也是可以的)

    bash 代码:
    hugo new post/some-content.md

    站点目录下此时会出现一个content文件夹,文章是存放在了post目录下,新创建的文件默认包含如下内容,根据需要修改即可:

    bash 代码:
    ---
    title: "Some Content"
    date: 2022-05-20T08:40:33+08:00
    draft: true
    ---

    预览博客

    因为我是直接在服务器进行的搭建的,所以我就不用hugo server -D指令进行预览了,我是直接把生成的静态文件放入新增的站点下来直接访问域名查看。

    首先,构建静态文件。默认情况下,输出的内容位于 站点目录/public/ 目录中(可以通过-d/--destination参数修改输出位置,或者在配置文件中设置publishdir参数)

    bash 代码:
    hugo -D

    然后,我是有个测试站点的

    我把hugo生成的静态挪到测试站点,复制过去后访问域名马上就能看到情况,显示下图情况,便完成了hugo博客搭建

    1、主题的文件路径是这样的Hugo\_blog\themes\ananke,路径不要弄错了。

    2、在Hugo\_Blog目录下创建一个content文件夹,content文件夹下再创建一个post文件夹。post文件夹里才是真正放md文档的地方。如果路径放错了,文章显示不出来。

    3、语言设置
    这两行配置改一下就行了。注意就是小写,不是大写

    bash 代码:
    languageCode = "zh-cn"
    defaultContentLanguage = "zh-cn"  

    4、关于作者【菜单】
    在这个目录下Hugo\_blog\content直接创建md文档编写即可,文档里的title就是菜单名

    5、报错error: failed to transform resource: SCSS

    bash 代码:
    Building sites … ERROR 2019/08/27 16:56:32 error: failed to transform resource: SCSS processing failed: file "stdin", line 3, col 1: File to import not found or unreadable: bulma/bulma. 
    Total in 13 ms
    Error: Error building site: logged 1 error(s)

    这个错误耗费的时间比较长,最后找到了hugo一个英文社区。大神说把hugo换成扩展版就可以了,然后就成功了。
    地址:hugo

    6、页面加载不出来

    • hexo是在站点目录,比如Hexo\_blog下进行git commit等类似操作的。
    • hugo是首先在Hugo\_blog进行hugo编译,然后生成一个public文件夹。然后在Hugo\_blog\public 目录下进行 git commit的,很容易出错。
    声明:本文由 公爵(博主)原创,依据 CC-BY-NC-SA 4.0 许可协议 授权,转载请注明出处。

    还没有人喜爱这篇文章呢

    发一条! 发一条!
    博客logo 公爵书房 | 技术分享 以指键之轻,承载知识之重 51统计 百度统计
    MOEICP 萌ICP备20226257号 ICP 赣ICP备2022001242号-1 ICP 闽公网安备35020502000606号 又拍云 本站由又拍云提供CDN加速/云存储服务

    🕛

    本站已运行 1 年 257 天 6 小时 34 分

    🌳

    自豪地使用 Typecho 建站,并搭配 MyLife 主题
    公爵书房 | 技术分享. © 2022 ~ 2023.
    网站logo

    公爵书房 | 技术分享 以指键之轻,承载知识之重
     
     
     
     
    壁纸