Git Product home page Git Product logo

A Hugo blog about Charles 'eallion' Chin

Chance favors the prepared mind.

Build Hugo and Deploy

FOSSA Status GitHub repo size GitHub tag (latest by date) GitHub commits since tagged version GitHub last commit Better Uptime Badge

GitHub issues

✨DEMO:https://www.eallion.com

备忘录

📦️ 主仓库

https://github.com/eallion/eallion.com

备份仓库

https://[email protected]/eallion/eallion.com
https://gitlab.com/eallion/eallion.com

添加备份仓库 Remote

Tip

Remote url 传递 id:token 免输各个 git 仓库的账号密码

git remote set-url --add --push origin https://id:[email protected]/eallion/eallion.com.git

$ git remote -v
origin  https://github.com/eallion/eallion.com (fetch)
origin  https://github.com/eallion/eallion.com (push)
origin  https://[email protected]/eallion/eallion.com.git (push)
origin  https://gitlab.com/eallion/eallion.com.git (push)
origin  https://git.eallion.com/git/eallion/eallion.com.git (push)

架构备忘

  • 国内:部署至腾讯云 EdgeOne (2024.01.06)
  • 境外:部署至腾讯云 EdgeOne (2024.01.06)

GitHub Actions

Update:2024.01.06

🎨 主题 DoIt

Update:2022.12.12

本博客使用主题为:DoIt

此次更新,主题使用 git submodule 的方式引入,不破坏原主题任何文件结构,所有自定义样式不再在 Theme 目录下修改。

git submodule add https://github.com/eallion/hugo-theme-doit.git themes/DoIt

克隆博客后同时克隆主题:

git submodule update --init --recursive

# npm run theme

如果上游主题有更新,更新主题 DoIt 的 submodule:

已更新脚本

- git submodule update --remote --merge
+ npm run update
  • 首页基于 Google for developers [f3fdc25] 构建
https://github.com/GoogleChrome/developer.chrome.com
https://github.com/eallion/eallion.com/blob/main/assets/css/_custom.scss
https://github.com/eallion/eallion.com/blob/main/assets/js/custom.js
https://github.com/eallion/eallion.com/tree/main/layouts/_default
https://github.com/eallion/eallion.com/tree/main/data/authors
https://github.com/eallion/eallion.com/tree/main/data/neodb

🔊 嘀咕页面

嘀咕页面 https://www.eallion.com/toot 为 Mastodon 个人实例 e5n.cc 的数据展示。利用 mastodon-embed-feed-timeline 这个项目集成到博客页面。基于 v3.9.1 版本修改,后续保持同步更新,但没有完全跟随上游版本号。

📦️ 首页 CSS 打包

首页利用 uncss 打包,去掉无用的 CSS,注释掉 layouts/index.html 中的 css 部分,然后运行:
需要注意 layouts/index.html 头部的注释说明

# npm install uncss -g

npm run uncss

✏️ 写新文章

  1. 生成新文章

通过 Hugo 命令 New 一篇新文章模板:

已更新脚本

- hugo new posts/daily/new_title.md
+ npm run new
  1. 编辑文章

通过 TyporaVSCode 编辑第一步 New 出来的文章。
这篇文章在 example/posts 目录下,文件名为:*.md,为 npm run new 输入的文字。
编辑好之后需要把这个文件复制到 content/posts 相应的目录中,再 git push

  1. 修改 Front matter
  • title (必填) 自动生成,按需修改
  • images (选填) OG Image 和首页渲染需要用到
  • authors:目录保持默认:["eallion"],其他支持:["shanzei"]
  • categories (必填) 按需修改
  • tags (必填) 按需修改 (约定:本博客单篇文章标签数上限为 4)
  • slug (必填) 按需修改,文章网址 URL
  • draft: true (必填) 如果需要公开发表,需改为:draft: false
  1. 生成 AI 提要

写完文章,按 data 目录中的 summary.json 文件手动生成摘要。

  1. 生成 OG image

打开 https://cover.eallion.com (备用) 生成 OG image,放到博客 static 目录。以前的文章利用 API 生成 OG。

  1. 维护其他页面

注意查看 Layouts 中的模板和 data 中的数据文件。

  • 嘀咕:到 e5n.cc 发 Toot;
  • 观影:到 豆瓣网 NeoDB 标记;
  • 随手拍:到 e5n.cc 发带有 #相册 标签的 Toot;
  • 好物:数据按 data 目录中的 goods.json 文件更新;
  • Penta:数据按 data 目录中的 penta.json 文件更新
  1. Push

完成写作后,Push 到 GitHub 仓库会自动构建部署。

git add .
git commit -m "docs: add a new post"
git push
  1. 本地调试 (Web Server)

安全没有必要把 Hugo 当成 Web Server

已添加脚本:

已更新脚本

- ./server.sh
+ npm run server

# 查看博客实际效果 👇
# npm run preview

脚本内容:

git submodule update --remote --merge && start http://192.168.0.5:1313 && hugo server -w -D -p 1313 --bind 0.0.0.0 --contentDir example --minify --forceSyncStatic --ignoreCache --noHTTPCache --disableFastRender -e production --enableGitInfo --disableKinds RSS --printUnusedTemplates --templateMetrics --templateMetricsHints

运行脚本后会自动打开预览页面:http://127.0.0.1:1313

  • hugo server 把 Hugo 当作 Web 服务器,而非构建静态网页
  • -w 有文件变化立即刷新 (默认开启)
  • -D 构建草稿,撰写新文章时很有用
  • -p 1313 指定端口号 1313 (默认 1313)
  • -t hello-friend 使用 hello-friend 主题
  • -enableGitInfo 开启 GitIifo
  • --bind 0.0.0.0 绑定 IP,局域网其他设备 Debug 时很有用
  • --contentDir example 指定文章目录 example,默认为 content
  • --cleanDestinationDir 清空目标目录
  • --forceSyncStatic 强制同步静态文件
  • --ignoreCache 忽略缓存
  • --noHTTPCache 关闭 HTTP 缓存
  • --renderStaticToDisk Hugo 0.97.0 新特性,从硬盘渲染静态文件,从内存渲染动态文件
  • --disableFastRender DoIt 主题使用了 .Scratch,建议开启此参数
  • -e production DoIt 的 评论系统CDNfingerprint 不会在 development 环境下启用
  • hugo server --help 查看 server 所有命令
  1. 本地构建

手动构建命令:

已更新脚本

- hugo --cleanDestinationDir --forceSyncStatic --gc --ignoreCache --minify --enableGitInfo
+ npm run build
  • --cleanDestinationDir 构建前先清理目标目录,即 public
  • --forceSyncStatic 强制同步 static 目录
  • --gc 构建后执行一些清理任务 (删除掉一些没用的缓存文件)
  • --ignoreCache 构建时忽略缓存
  • --minify 压缩网页代码
  • --enableGitInfo 开启 GitIifo
  • hugo --help 查看所有命令

🚨 刷新 jsDelivr 缓存

将资源文件链接中的 cdn.jsdelivr.net 改为 purge.jsdelivr.net,在浏览器中请求即可刷新 CDN。

- https://cdn.jsdelivr.net/gh/eallion/eallion.github.io/style.css
+ https://purge.jsdelivr.net/gh/eallion/eallion.github.io/style.css

💥 Git 增加缓冲区 50M

git config --local http.postBuffer 52428800

💥 清理 Git 仓库

git rm -r --cached .
git reflog expire --expire=now --all
git gc --prune=now --aggressive

💥 本地资源引用

DoIt 主题功能

有三种方法来引用图片音乐等本地资源:

  1. 使用页面包中的页面资源。 你可以使用适用于 Resources.GetMatch 的值或者直接使用相对于当前页面目录的文件路径来引用页面资源。
  2. 将本地资源放在 assets 目录中,默认路径是 /assets。 引用资源的文件路径是相对于 assets 目录的。
  3. 将本地资源放在 static 目录中,默认路径是 /static。 引用资源的文件路径是相对于 static 目录的。

引用的优先级符合以上的顺序。

在这个主题中的很多地方可以使用上面的本地资源引用, 例如链接图片image & music shortcode 和前置参数中的部分参数。

页面资源或者 assets 目录中的图片处理会在未来的版本中得到支持。 非常酷的功能!😎

🖼️ 图片

Update:2023.10.22
图片放到博客 static/assets/images 目录,即方法二

因为 jsDelivr 2020.08.15 的 ‘新政策’,现在没有用 GitHub + jsDelivr 当图床了。

  • 方法一

手动添加图床。 现在写博客添加图片,需要手动添加图片地址。 一般本博客会使用腾讯云 COS,图床链接为:https://images.eallion.com/

  • 方法二

原方法。 直接把图片丢到 Hugo 仓库的 static/images/ 目录下即可。 图片存放目录:

Hugo 目录的 static/images/ 目录下 (可按年月分类)。

文章中有 2 种方法引用图片 URL:

/images/1970/01/01.jpg https://www.eallion.com/images/1970/01/01.jpg

📷 相册

相册页面可以用主题内置的 {{< figure >}}{{< image >}} Shortcodes 生成。 如:

{{< image src="https://images.eallion.com/penta/20150218-Shaco.jpg" alt="Shaco" caption="Shaco" >}}

📷 LOL 五杀

数据按 data/penta/penta.json 格式维护即可,五杀截图放到 static/assets/images/penta/screenshot 目录。

📄 LICENSE

This project is licensed under GLWTPL。 Hugo is licensed under Apache License 2.0。 Theme DoIt is licensed under MIT

FOSSA Status

GLWT(Good Luck With That,祝你好运)公共许可证
版权所有© 每个人,除了作者

任何人都被允许复制、分发、修改、合并、销售、出版、再授权或
任何其它操作,但风险自负。

作者对这个项目中的代码一无所知。
代码处于可用或不可用状态,没有第三种情况。


                祝你好运公共许可证
            复制、分发和修改的条款和条件

0 :在不导致作者被指责或承担责任的情况下,你可以做任何你想
要做的事情。

无论是在合同行为、侵权行为或其它因使用本软件产生的情形,作
者不对任何索赔、损害承担责任。

祖宗保佑。

g0f.cn's Projects

cf-ali-dnspod-ddns-ip icon cf-ali-dnspod-ddns-ip

将优选IP推送到CF和阿里云和DNSpod进行DNS解析,也可动态支持本地公网IP推送到需要的平台

cf-speed-dns icon cf-speed-dns

CloudflareSpeedTest 推送「每5分钟自选优选 IP」https://ip.164746.xyz

daily-bonus icon daily-bonus

签到脚本✅ master 分支:bilibili 直播、v2ex、百合会论坛。dev 分支:acfun、bilibili、csdn、v2ex、百度贴吧、百合会论坛、最终幻想14。

dymcat.github.io icon dymcat.github.io

呆猫网是一个可以免费看海量直播秀、小视频、电影和图片的网站。呆猫网不储存任何媒体文件,一切资源内容都是由其他平台相关数据接口提供。

gblog icon gblog

📝 A Hugo blog about Charles Chin.

hugo icon hugo

some thoughts on shit i care about

issues-json-generator icon issues-json-generator

自动提取本仓库每个 issue 中的第一段 JSON 代码块并保存到仓库中,可用于友链、书签等数据收集。

koobai icon koobai

工作生活记录、折腾备忘, 同时分享下日常使用的软件、 观看的影视、喜欢的好物等~~

rss-gpt icon rss-gpt

Using ChatGPT to summarize your personalized RSS feeds

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.