Hugo-bootstrap-x 开源

Hugo 主题 hugo-bootstrap-x 使用的技术汇总

技术

布局

• Scrollspy：根据滚动位置自动更新引导导航或列表组组件，以指示viewport中当前活动的链接
• sticky：根据正常文档流进行定位，相对它的最近滚动祖先位置固定不变

资源压缩

• font-spider 一个智能 WebFont 压缩工具，它能自动分析出页面使用的 WebFont 并进行按需压缩。使用示例：

# 安装
npm i font-spider -g

# 压缩
sudo font-spider --no-backup --ignore "bootstrap/*.css$" **/*.html

• purgecss 一个从项目中删除未使用的CSS的工具。使用示例：

# 安装
$ sudo npm i purgecss -g

# 压缩
$ sudo purgecss -css scss/main.min.css -rejected --content "**/*.html" --output scss/

类似的工具还有：purifycss

# 安装
$ sudo npm i -g purifycss

# 使用
purifycss "./scss/main.min-1.css" "**/*.html" --min --info --rejected --out "./scss/main.min.css"

主题

参考：https://web.dev/cls/

其他

• Html js 导入Npm包