对于Chirpy各种奇怪bug的研究

READ THE DOCS!

这篇文章中的问题很大概率是因为你没有阅读官方的说明导致的！

可能包含的bugs

• 无法切换light/dark模式
• toc目录无法正常显示，即使已经全局启用
• 无法进行搜索
• 图片的加载动画（shimmer）永远不会消失
• 无法正常使用PWA功能（更新网页端后网页显示需要更新，但点击确认后仍然不会更新，并持续弹出相同的提示）

这些问题从建站起就已经困扰我非常久了，最开始我以为是因为assets/lib下的submodules没有clone，于是git submodules update --init，但是没有任何改变，而且苦于编译没有任何报错，因此一直搁置了这个问题（事实上，如果没有启动static assets功能，这些文件会自动从CDN获取，相关设置位于_data/origin/cors.yml）。直到今天，我在开发者工具中发现了这样的报错：

然而，如果你定位到编译好的网站目录下，会发现根本没有assets/js/dist这个文件夹，更别提对应的文件了。于是顺藤摸瓜找到了这个discussion：

JS distribution files have been removed since v5.6.0, and Bootstrap CSS has been lean since v7.0.0. Therefore, for all future upgrades, you should compile the CSS/JS files yourself.

从5.6.0版本开始，Chirpy已经移除了js文件的分发，如果你的网站是以直接fork官方仓库的形式创建的，那么这些文件需要你自行编译，所以才会出现js文件缺失的问题（或许这也是为什么官方不推荐以这种方式创建）。

另外，这些也可能是jekyll框架的通病，参考这里。

解决方法

1. 安装Node.js，这会同时为你的电脑配置npm环境；
2. cd到网站的工作目录，运行npm install，npm会自动读取packages.json内的文件并安装好需要的依赖（你可能需要先运行npm install rollup；如果出现冲突，你可能需要使用--force强制安装）；
3. 运行npm run build，npm会自动将相关文件编译好后拷贝到对应的文件夹内，此时assets/js/dist目录下应当以及有以下文件：
   • app.min.js
   • categories.min.js
   • commons.min.js
   • home.min.js
   • misc.min.js
   • page.min.js
   • post.min.js
   • sw.min.js
4. 检查根目录下的.gitignore内是否有_sass/dist或assets/dist，如果有，记得删除（这两条目录应当在你创建网站、运行tools/init.sh时就已经被删除；如果仍然存在，说明网站在部署时没有按照标准流程）；
5. 运行jekyll build，如果没有问题的话就可以正常push了。