70、【Ubuntu】【Hugo】搭建私人博客:新建站点

【声明】本博客所有内容均为个人业余时间创作,所述技术案例均来自公开开源项目(如Github,Apache基金会),不涉及任何企业机密或未公开技术,如有侵权请联系删除

背景

上篇 blog
【Ubuntu】【Hugo】搭建私人博客:Hugo 版本对比

分析了 Extended 版本中,额外集成的 Sass/SCSS 编译功能,并对比了和 CSS 的区别,并类比了和 C语言/汇编的关系,下面继续

搭建私人博客

上篇 blog 分析了 Sass/SCSS 的编译功能,下面再分析 Hugo Extended 版本中另外一个 WebP 图像处理功能

WebP 图像处理

首先,WebP 是 Google 推出的一种新型图片格式,比传统的 JPG/PNG 体积更小,画质更好,能让网站加载更快,比如一张 JPG 图片体积是 500KB,转成 WebP 后,体积只有 200KB,肉眼看不出差别,比如在 Markdown 中写

md 复制代码
![alt text](/images/image.png)

Hugo 可以在生成网站时,会自动把 photo.jpg 转成 WebP 格式,并让支持 WebP 的浏览器优先加载,但这个功能需要图像处理引擎,比如

  • Hugo 普通版:没有图像处理引擎,不能转成 WebP
  • Hugo Extended 版 :内置 libwebp 引擎,可以自动优化和转换成 WebP 图片

这对做博客,作品集,电商展示等图片多的网站特别有用

OK,最后再总结下

  • Hugo 普通版:纯 Go 编写,无 CGO 依赖
  • Hugo Extended 版 :启用了 CGO,链接了 C/C++ 库,比如 libsass(用于将 .scss 或 .sass 文件编译为 CSS),与 libwebp(用于图像处理,比如生成 WebP 格式)

当然,在官方发布的二进制文件中,已静态链接 libsass 和 libwebp,用户无需自行编译,开箱即用

OK,分析完 Hugo Standard 标准版和 Extended 版的区别,下面来创建博客站点,在终端输入

bash 复制代码
hugo new site myblog

创建测试站点,当然,可以通过 help 命令查看命令说明,比如终端输入

bash 复制代码
hugo help new site

可以看到帮助信息如下

可以看到,hugo new site [path] [flags] 命令可以在指定的目录 path 里创建一个 Hugo 网站,网站的结构完整(有 content/,layouts/,themes 等),但没有文章,没有主题,需要后续添加,创建成功后,可以看里面的结构

bash 复制代码
cd myblog
ls

hugo new site [path] [flags] 命令常用参数 flags 包括

  • -f toml(默认) :配置文件用 hugo.toml
  • -f yaml:配置文件用 hugo.yaml
  • -f json:配置文件用 hugo.json
  • --force:即使目标文件夹非空,也强制创建,这个谨慎使用,因为会污染网站结构

OK,Hugo 站点创建完了,接下来看下一步,配置主题

Hugo 主题有很多,官方链接 https://themes.gohugo.io/ 可以看主题 Demo,选择自己喜欢的风格

下面以经典主题 PaperMod 为例,终端输入

bash 复制代码
git init

git init 是 Git 的初始化命令,可以把当前文件夹变成一个 Git 仓库,此时可以用 Git 来跟踪,保存,管理这个项目下所有文件的变更

OK,此时 Hugo 站点下就出现了一个隐藏文件夹 .git

这个 .git 文件夹会记录

  • 所有文件的历史版本
  • 谁修改了什么(作者,时间等)
  • 分支信息,标签等

项目文件本身不会被修改,只是多了个版本控制后台,当然,一个项目只需要 git init 一次,重复运行会提示 Reinitialized existing Git repository

此时当前文件夹就可以记录历史,回滚错误和协作开发了,这是使用 Git 的第一步,也是最重要的一步(万事开头难,好的开始是成功的一半!)


OK,本篇先到这里,如有疑问,欢迎评论区留言讨论,祝各位功力大涨,技术更上一层楼!!!更多内容见下篇 blog
【Ubuntu】【Hugo】搭建私人博客:添加主题

相关推荐
无足鸟ICT1 小时前
【RHCA+】ipcrm命令(删除IPC资源)
linux
星恒随风2 小时前
MySQL 从零入门(四):表的增删改查与基础查询详解
linux·服务器·数据库·笔记·mysql
Z21-X3 小时前
云原生运维学习笔记:ECShop全链路容器化部署与Docker底层资源隔离深度剖析
运维·笔记·学习·云原生
Zucker n4 小时前
文献发现、课题组织与证据可追溯的论文阅读。
论文阅读·windows·ubuntu
陈希1235 小时前
Linux 网络诊断工具实战:ping、curl、tcpdump、mtr、dig 用法详解
linux·网络·tcpdump
进击的荆棘5 小时前
Linux系统——线程同步与互斥之线程池和安全
linux·运维·服务器·安全·单例模式·线程
刘大望5 小时前
不用买开发板:用 QEMU 走通嵌入式 Linux 全流程(三)存储与网络实地验证
linux·qemu·嵌入式linux·alpine
瑞雪兆丰年兮6 小时前
JavaWeb-day11-SpringBootWeb案例(文件上传)
java·运维·服务器·javaweb·oss
那明眸似水6 小时前
云原生项目三:Docker秒级启动NextCloud个人网盘存储办公系统
linux·运维·docker·云原生·容器
小南家的青蛙8 小时前
微服务体系下DevOps运维岗位面试方案设计
运维·面试·职场和发展·devops