Hexo

基本操作

hexo clean         #清除 hexo 的缓存。即删除 public文件夹
hexo g             #更新 hexo 的更改。即生成 public文件夹
hexo s	          #本地预览hexo
hexo d	          #上传hexo。即上传 public
hexo g -d          #连续执行 hexo g 和 hexo d
hexo n page "xxx"  #新建一个xxx页面
hexo n "xxx"       #新建一个xxx文章

文章更新

hexo其实是可以按你上传时修改文章的时间自动显示你的更新时间的，所以给文章 font-mater 加上 updata 其实不是很有必要

font-matter优化

可以在 scaffolds\post.md 或 scaffolds\page.md 中，增加新的font-matter 属性，这样当你新建文章或页面时，就会帮你自动把需要的font-matter创建好了

先clean清除缓存，再g保存静态文件，再d上传静态文件。
如果不先清除缓存，上传后可能远端和本地不一致

CSS

[data-theme="dark"]代表夜间模式
@media screen and (max-width: 768px) 代表手机模式

对页面单独设置

在写关于页面的时候，我想实现一些自己的操作，但又不想失去hexo本身对我页面的渲染。
可以直接在md文档里写CSS和JS，这样就可以实现对自定义页面单独的设计了。

<style>
    ……
</style>

……

npm

npm基本操作

npm login         #登录
npm init          #初始化储存库，生成的 page.json 可以随时更改 有 page.js 后，前两步就可以不做了
npm version patch #修改小版本版本
npm publish       #发布储存库
参考： https://www.cnblogs.com/steamed-twisted-roll/p/13497662.html

注意

package-lock.json 和 package.json 一定要及时备份。当你出错时，将 github 上二者的内容替代掉现在的内容（vscode 可以实时比较更改），然后执行 npm install。npm 会根据这两个 json 文件的内容来对组件进行安装和卸载。

PS:执行 npm audit fix --force 把我好多组件都删了，幸好备份了，copy 覆盖后，npm install 就解决了

CDN

jsdelivr 缓存

jsdelivr在第一次之后用到是缓存，就算你更新了文件它仍然是用之前的缓存，也就是说jsdelivr上加载的文件并没有更新

你可以选择加 @版本号 这样就可以加载固定的版本。
要想更新，加一个 @main 即可，这样就会更新缓存了。
若什么都没加，则默认是 @lastest 加载最后的版本，不会更新缓存

unpkg 镜像

unpkg.zhimg.com 知乎镜像
npm.elemecdn.com 饿了么镜像

unpkg并不会像jsdelivr那样，在文件后缀前加个.min就能自动压缩
unpkg的@latest并不会自动帮我更新版本
如果要更新版本，需要自己手动加版本号，或者好像后面什么都不填，过段时间就会自动更新了

知乎镜像貌似也炸了，唉~

hexo 辅助函数

当我写自定义JS时，总是在想有没有什么判断首页，分页的办法，但是F12并没有看到二者标识的区别。其实在hexo官方文档，是有说明pug文件的辅助函数的，利用这些辅助函数，我们可以很好的实现组件在各种页面的逻辑。链接如下：https://hexo.io/zh-cn/docs/helpers#is-current。

这里我简单摘录一些常用的。

is_current

检查 path 是否符合目前页面的网址。开启 strict 选项启用严格比对。

<%- is_current(path, [strict]) %>

is_home

检查当前页面是否为首页。

<%- is_home() %>

注意，经过实测，这里的home包含了首页和分页，如果想要只包含主页，应该用

is_current('/', [strict])

is_post

检查当前页面是否为文章。

<%- is_post() %>

is_page

检查当前页面是否为独立页面。

<%- is_page() %>

这里放个使用实例吧

优雅的调用JS

JS异步优化请去看

关于JS异步请去看 JS异步优化 — async 和 defer

关于自定义JS的使用

挺实用的一个操作，可以让你JS执行的更快更稳定。参考：https://akilar.top/posts/7c16c4bb/#Github-Action
正常我们都可以用inject引入。但有一次我写了一个改写侧栏说说的JS，JS能正常执行，但由于我只把侧栏说说放到首页，而inject是全局引入，所以当我进入其他页面时，控制台就会报错：找不到侧栏说说。又例如我想使用随机背景，我可以将随机背景的JS通过pug放到#web_bg下面，这样当我#wen_bg 此DOM一加载完，就可以执行JS。关于随机背景，我的建议是既不要加defer也不要加async

通过阅读 https://akilar.top/posts/7c16c4bb/#Github-Action 店长的文，我们知道可以通过把JS放到CDN处，再在pug文件中用相应逻辑引入就行了。店长提供的是把JS放到相应插件的pug下这个方案，但若我们使用的是插件，本地并没有该插件的pug文件时，也可以采用辅助函数判断引入的方案，二者大差不差。