lh1me
item.title
Aomori

Hexo 是一款快速、简洁且高效的博客框架,拥有超快生成速度,支持 Markdown,一键部署和高度可扩展性。

Aomori 是基于 Hexo 一系列优势所开发出来的一款主题,主题特性如下

  • 丰富的网站样式
  • 丰富的主题配置
  • 优化图片视频播放
  • 出色的SEO优化
  • 响应式布局
  • 开源并持续更新

最近在一篇文章上看到了一个很有意思的想法,利用了 SVGFavicon 设置成 😊 Emoji

于是突发奇想将这个想法加入了 Aomori,已更新 配置文档

Canvas 图片绘制完全覆盖铺满效果

问题

最近在需求中需要将用户照片绘制成海报,遇到需要将照片以保持宽高的情况绘制在一个相框内

解决

参照 background-size: cover 的效果

缩放背景图片以完全覆盖背景区,可能背景图片部分看不见。和 contain 值相反,cover 值尽可能大的缩放背景图像并保持图像的宽高比例(图像不会被压扁)。该背景图以它的全部宽或者高覆盖所在容器。当容器和背景图大小不同时,背景图的 左/右 或者 上/下 部分会被裁剪。

直接上代码理解就行了。

item.title
Nuxt.js 利用 Nginx 实现同构降级策略

Nuxt.js 是很优秀的 SSR 框架之一,让我们能够使用 Vue 直接进行项目开发,并且不需要关心过多的 Node 服务端内容。

由于公司项目需要考虑到 SEO 问题,因此我选用了 Nuxt 作为底层框架。项目完成上线后,考虑到容灾和项目稳定性,虽然说已经部署了负载均衡,保险起见还是把 CSR 降级策略也搞了(避免背锅

Aomori - DisqusJS

Aomori 引入了 DisqusJS,用于解决中国大陆对 Disqus 的访问限制。

官方介绍

使用 Disqus API 获取到的数据渲染评论列表,搭配 Disqus API 的反代可以实现在网络审查地区加载 Disqus 评论列表;支持自动检测访客的 Disqus 可用性自动选择加载原生 Disqus(评论完整模式)和 DisqusJS 提供的评论基础模式。

使用方式

参照官方配置说明即可

aomori_disqusjs:
  enable: true
  shortname: ""
  siteName: ""
  api: ""
  apikey: ""
  nesting: 4
  nocomment: "这里冷冷清清的,一条评论都没有"
  admin: ""
  adminLabel: ""

注意,以上配置是 Aomori 现在支持的配置,部分选配配置暂时不支持自定义。


题外话,我的博客使用 Disqus 也一段时间了,下一步我可能会弃用 Disqus,选择别的评论框架了,Disqus 的大陆访问问题没办法忽视,即使有 DisqusJS 这样优秀的解决办法,但是我个人还是觉得体验还是差强人意。

新增了文章徽章功能,现在支持置顶、转载的徽章标记

Demo 见此条推文右上角以及置顶文章右上角~

想要更多的徽章玩法可以评论留言或者提交 Issue

item.title
Dependabot 私有部署指南

本文记录了 Dependabot 私有部署的心路历程。团队使用 GitLab 社区版内网部署,所以试用了 Dependabot 同样在内网部署。