hexo博客记录八开发自用插件

起因:源自上一篇,我用一个脚本替代了命令行可以指定草稿的生成路径之后,发现会导致显式修改了的博客文件Front-matter的内容,于是一个很必要的使用插件就不能够有效工作了。于是,就萌生了基于原插件的二次开发的念头。

问题复述

原本的博客如果不显式标明layout的话,在渲染的时候,是会自动定义成为layout: post的,而一般类似tags,cacategories等则是会定义为layout: page

于是原有的一个插件hexo-abbrlink则是会依据这个信息进行选择性的应用。而我经过使用脚本自动生成指定路径的草稿则是必须显式标明layout,两者发生了冲突,导致该插件不能够正常应用。

于是,我就想要在原插件的基础上进一步开发,能够指定对不同的layout博客应用该插件或不应用该插件

插件开发

首先我需要把我想要实现的功能需求罗列出来,否则重复造轮子没有意义。

需要了解到现有的几个相似功能的插件:

hexo-abbrlink,这个是我现在能够看到的功能最全的插件了,包括两个计算方式以及多个尾端长度。

hexo-abbrlink2,相较于第一个插件,是能够从1开始依次增长的,不过这个功能我没有需求,于是放弃了集成该功能。

确保不会重名

包名不能跟现有的冲突,如果冲突会无法发布。

访问https://www.npmjs.com/package/ + [包名],例如https://www.npmjs.com/package/testp,如果该包不存在,会提示404 not found,否则会展示该包的信息。

生成json

可以使用命令:

npm init

会跟着引导生成json文件,(其实可以直接编写这个json文件的),这里附上我已经编辑好了的:

{
  "name": "hexo-abbrlink3",
  "version": "1.0.1",
  "description": "create one and only link for every different layouts for hexo",
  "main": "index.js",
  "scripts": {
    "test": "node test.js"
  },
  "keywords": [
    "hexo",
    "link",
    "permalink",
    "abbrlink3"
  ],
  "repository": {
    "type": "git",
    "url": "git+https://github.com/Keen-King/hexo-abbrlink.git"
  },
  "author": "君匡",
  "license": "ISC",
  "homepage": "https://github.com/Keen-King/hexo-abbrlink3/blob/master/README.md",
  "dependencies": {
    "hexo-front-matter": "^1.0.0",
    "hexo-fs": "^3.1.0"
  }
}

编写插件逻辑

首先我需要从博客站点配置文件中读取到我哪些布局是需要应用该插件的,而哪些又是需要标明不需要的。

于是,我截取如下:

permalink: :year/:category/:abbrlink/ # 生成效果链接

abbrlink:
  alg: crc32  # 算法:crc16(default) and crc32
  rep: hex    # 进制:dec(default) and hex
  allow: ['post','school','cpp',"java","blog"] #允许的模板类型.默认为["post"]
  disallow: [] #不允许的模板类型,默认为空列表

单独编辑一个函数,用来循环遍历判断正在应用该插件的博客是哪种布局:

function judge(data, config) {
    let allowList = config.allow || ["post"] //默认是对post进行应用
    let disallowList = config.disallow || [] //默认没有其他布局需要跳过
    for (let i = 0; i < disallowList.length; i++) {
        if (disallowList[i] == data) {
            return false;
        }
    }
    for (let i = 0; i < allowList.length; i++) {
        if (allowList[i] == data) {
            return true;
        }
    }
    return false;
}

然后将原来的判断位置,修改为该函数。

在本地多次测试没有问题之后,直到可以发布了。

插件发布到npm

在发布到npm之前,先去npmjs.com注册账号并激活邮箱

在这里插入图片描述

然后在本地执行命令

 npm login

注意!此时你的npm应该是使用官网源,否则就会报错:

在这里插入图片描述

切回官方源:

npm config set registry https://registry.npmjs.org

查看当前源:

npm config get registry

登录成功:

在这里插入图片描述

此时在插件路径里运行如下命令,就可以发布到npm了。

$ npm publish1

如果你的邮箱没有激活,会出现E403的错误:

在这里插入图片描述

发布成功!

在这里插入图片描述

此时就可以让别的小伙伴用这个命令来下载你的插件了。

npm init -y

npm install hexo-abbrlink3

插件发布到hexo

首先在github上面fork主要仓库,然后clone到本地,安装所依赖的插件。

git clone git@github.com:Keen-King/site.git

cd site
npm install

修改文件site/source/_data/plugins.yml,在最上面加上一行

- name: hexo-abbrlink3
  description: create one and only link for every different layouts for hexo
  link: https://github.com/Keen-King/hexo-abbrlink3
  tags:
    - permalink
    - link
    - 固定链接
    - abbrlink3

保存后在site文件夹内开启命令行:

git commit -m "添加插件 hexo-abbrlink3"

git push

在这里插入图片描述

推送成功!

发起合并请求:

在这里插入图片描述

点击这个按钮会创建一个新的拉取,点击之后:

在这里插入图片描述

没有冲突就可以合并了。

在这里插入图片描述

等到通过审查,就算成功了!

在这里插入图片描述

感谢

感谢现在努力的自己。本文首发于自己的博客,链接:https://www.clzly.xyz/2021/Blog/e794f916

感谢原有插件的开发者。

https://hexo.io/zh-cn/api/

https://hexo.io/zh-cn/docs/plugins.html

https://zhuanlan.zhihu.com/p/31901377

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值