Hexo过滤器Filter

2022-06-09 更新: 2022-06-09

web / hexo

字数统计: 1k | 阅读时长≈ 4 分钟

前言

之前兴冲冲的自己用Nodejs实现一个简易式可以加载插件打包器，虽然可以对文件进行压缩，但和Hexo 部署包没有产生什么关系，也和自己学到一半，就冲冲有关系。

官方中文文档也是确实的，所以我是看主题和库，进行模仿和学习的。

今天我将用文字记录，不加图，没有工作不想搞图床，(* ￣3)(ε￣ *)，谁能给我一份工作。

我还没吃早餐，┭┮﹏┭┮，突然想起尼米。

开始讲述

创建

首先是文件目录，在你的根目录里创建一个名为 scripts的文件夹。

文件内可以创建一些Hexo的扩展，对应的英文名小写复数形式即是对应的扩展器集成。

如：过滤器 (Filter)则在上面的所说的目录里创建一个名为 filters的文件夹

创建文件夹后，在该文件夹里加入 index.js文件夹

并写入和调用相应过滤器函数。

'use strict';
module.exports=hexo=>{
	const {filter}=hexo.extend;
    filter.register(type,callbackFn,options)
}
//这里过滤器最先执行
//hexo.extend.filter.register('after_render:html',require('./lib/miniHTML'));

type 指的是过滤列表，详情看官方文档，here

callback指的是相应传参处理，…args参数，传递给内部的filter处理

options指的是对应的选项，具体，我也不太清楚，文档没那么细，慢慢摸索，也可以看 ide 是否有对应提示。

今天主要讲的是如何写出一个mini压缩过滤插件。

我这里options是priority的可选数字类型参数，它主要作用是负责优先级计算。

callback则是

(result:String,data:{
 	[key:String]:any,
    path:String,
    text:String,
 })=>{
     
 }

我在这里演示如何获取到它的参数数量

(...args)=>{
    console.log(args.length)
}

tips

如果输出太多个，我们可以通过创建一个上下文变量来进行控制。

最简单的可能是这样的

let count=0;
(..args)=>{
    count++;
    if(count===1){
        console.log(args.lenght);
    }
}

但我更喜欢这样，创建一个闭包作为上下文，最好是装饰器这样的，但显然不太可能。

(function(){
    let count=0;
    return (...args)=>{
        count++;
        if(count===1){
            //do it
        }
    }
})();

继续

话题扯远了，让我们会到正规。

通过打印，我列出自己对这个函数的了解。

result 变量就是hexo输入给plugin 的utf-8 的文本字符串，也就是你的写的代码以字符串的形式。

data对象

path属性通过打印可以知道均为.html后缀文件。

text属性则是underfined

…

这里data属性一些文本有点多，如果你需要你可以这样

console.log(Object.keys(data));

然后慢慢查找它。

return string 就是返回的结果作为下一个result

data：object

page变量

label	desc	type
tilte	标题	string
date	创建时间	Moment对象
…	…	…

path 相对路径，没有加上根路径

url 绝对路径，网络路径

config配置对象，_config.yml对象

theme配置对象，_config.yml对象

layout?

layout

env

{
  args: { _: [] },
  debug: false,
  safe: false,
  silent: false,
  env: 'development',
  version: '6.2.0',
  cmd: 'g',
  init: true
}

view_dir

site

{
  posts: _Query {
    data: [
      [_Document], [_Document],
      [_Document], [_Document],
      [_Document], [_Document],
      [_Document], [_Document],
      [_Document], [_Document],
      [_Document]
    ],
    length: 11
  },
  pages: _Query {
    data: [
      [_Document],
      [_Document],
      [_Document],
      [_Document],
      [_Document],
      [_Document]
    ],
    length: 6
  },
  categories: _Query {
    data: [
      [_Document],
      [_Document],
      [_Document],
      [_Document],
      [_Document],
      [_Document],
      [_Document]
    ],
    length: 7
  },
  tags: _Query {
    data: [
      [_Document],
      [_Document],
      [_Document],
      [_Document],
      [_Document],
      [_Document]
    ],
    length: 6
  },
  data: {
    menu: {
      '主页': '/',
      '归档': '/archives/',
      '分类': '/categories/',
      '标签': '/tags/'
    }
  }
}

_p

[Function (anonymous)]

tips:

nodejs如何打印函数呢？

我们可以利用toString方法。

funciton.toString()

哈哈，突然想起来它是内部函数。

cache

布尔值 true/false

下一步

这是极简版代码，具体配置我还需要多多研究，它已经成功上传到服务器了。

'use strict';
const {minify} = require('html-minifier')
module.exports = function(str, data) {
  const options=this.config.html_minifter;
  const {path}=data;
  return minify(str,{caseSensitive:true,collapseWhitespace:true,removeAttributeQuotes:true,removeCommentsL:true,minifyJS:true,minifyCSS:true,...options})
};

有缘更新

---------------- The End and I hope sunshines on the outside. ----------------

版权声明： 本博客所有文章除特别声明外，著作权归作者所有。转载请注明出处！