前言

本文大部分主题的配置以及样式都来源于 Akilarの糖果屋 大佬的博客,因为本人是个后端初学者,对于前端知识实在匮乏,记录此篇文章为了是让自己以后碰到问题可以看到记录。

对于我这种前端知识基本为0的人来说搭建个博客,彳亍,但是想把页面搞得好看一些太难了 T.T 。

此文目的是为了记录一下自己踩过的坑(在大佬那可能都是毛毛雨)。


问题记录

在搭建博客时没碰到过什么太大的问题,问题主要是在博客上加样式加东西时遇到的问题。

Live2d

这个是当初我在其他人的博客里看到的最想要的,最开始看到的是这种的

在网上查了一大堆教程,最开始用的是 hexo-helper-live2d ,过程中遇到过 live2d-widget 的教学,这个后面再说,因为我本来对前端的知识就基本为0,其实学的是后端,所以比较痛苦,最开始的问题是在我装了 hexo-helper-live2d 之后,页面上没有显示,找了好久也没找出来有效的办法,一度已经放弃了添加它的欲望。

后来是在一次偶然的情况下看到了 live2d-widget 的使用 ,

依然是在 Akilar 大佬的博客里(我的博客里的所有样式基本上都是搬的人家的),我最开始看到这个的时候因为其实是不想要对话框和一些其他的功能,我觉得之前那个 hexo-helper-live2d 的看板娘就挺好看的,但是在我看了大佬的博客后发现人家又新加了好多的人物,而且 live2d-widget 这个插件是支持换装的,我抱着试试的态度装了一下,结果发现效果还挺不错的,碰到的问题也不少

我先说结果,我是把autoload.js文件和它的库clone在了自己的GitHub上,需要用cdn加速的模型资源我是放在了vercel上,结果就是,

inject:
head:
# - <link rel="stylesheet" href="/xxx.css">
bottom:
# - <script src="xxxx"></script>
# Live2d js文件
- <script defer src="https://cdn.jsdelivr.net/gh/wwh926494/live2d-widget-wwh@1.0.2/autoload.js"></script>

碰到的最烦的问题是cdn刷新的问题,因为在部署的时候需要试是否可以使用,可以看到我用的文件版本都是指定的版本而不是 @latest ,因为我发现手动刷新jsdelivr的cdn缓存没用啊,我在网上查到都是把地址 https://cdn.jsdelivr.net/xxxxxx 的cdn换成 purge,像这样https://purge.jsdelivr.net/xxxxxx,在我刷新了之后发现并没有用,所以我在确定了我上传的这些资源能用的情况下,直接先提前在 autoload.js 文件写好下一个要发布的版本号,提前预判,这样也是可以正常使用了,但是后续想要变动的时候比较麻烦,等到后续有时间自己再加Live2d的新模型时再说吧。