IT博客汇 | Explorer\'s Guide

Explorer\'s Guide

Lynan发表于 2024-02-04 09:10:55

构建与托管

本站使用 HEXO 构建生成静态网站文件，托管在云服务器创建的 Plesk 面板中。

在 Plesk 中配置了 Webhook，当我提交变更到我的 Github 私有仓库以后，触发 Actions 构建网站，变更的内容将自动同步到 Plesk 网站文件夹进行更新。

个性化

主题

使用 Icarus 主题。

大屏设备可以获得最佳阅读体验。

字体

本站共计使用两种开源字体：

LXGWWenKai
The quick brown fox jumps over the lazy dog 敏捷的棕色狐狸跳过了懒狗
SourceHanSerifCN
The quick brown fox jumps over the lazy dog 敏捷的棕色狐狸跳过了懒狗

字体文件由脚本收集所有用到字符简化而成，提高加载速度。

generate-font-files.js

const fs = require("fs");
const _ = require("lodash");
const Fontmin = require("fontmin");

const directory = "source/_posts";
const scriptDirectory = "custom-scripts/font";
const fontFileDirectory = `${scriptDirectory}/files`;

const files = fs.readdirSync(directory).filter((item) => item !== ".DS_Store");
const fonts = fs
  .readdirSync(fontFileDirectory)
  .filter((item) => item !== "index.js");

const getLetters = () => {
  const letterMap = {};

  _.forEach(files, (file) => {
    const fileContent = fs.readFileSync(`${directory}/${file}`, "utf8");
    const letters = _.toArray(fileContent);
    _.forEach(letters, (letter) => {
      if (!letterMap[letter]) {
        letterMap[letter] = 1;
      }
    });
  });
  return Object.keys(letterMap).join("");
};

const currentLetters = getLetters();

const lettersText = fs.existsSync(`${scriptDirectory}/letters.txt`)
  ? fs.readFileSync(`${scriptDirectory}/letters.txt`, "utf8")
  : "";

if (currentLetters === lettersText) {
  return;
}

fs.writeFileSync(`${scriptDirectory}/letters.txt`, getLetters());

const generateFontFile = (letters) => {
  _.forEach(fonts, (font) => {
    const task = new Fontmin()
      .src(`${fontFileDirectory}/${font}`)
      .dest("themes/icarus/source/fonts")
      .use(
        Fontmin.glyph({
          text: letters,
          hinting: false,
        })
      )
      .use(Fontmin.ttf2woff2());

    task.run(function (err, files) {
      if (err) {
        throw err;
      }
    });
  });
};

generateFontFile(currentLetters);