给你的hexo博客配上swpp

前提

    swpp-backends（以下简称 swpp）插件的功能是为网站生成一个高度可用的 ServiceWorker（以下简称 SW），为网站优化二次加载、提供离线体验、提高可靠性，并为此附带了一些其它的功能。
    swpp 的全拼为“Service Worker Plus Plus”（或“ServiceWorker++”），但是其与已有的插件并没有关系，插件中所有代码均为我个人开发，这一点请不要误解。
    我不是太了解sw的功能，所以我只管配置方式，具体功能还请移步上文给出的文档链接~。
    首先，在博客根目录右键Git Bash here，输入以下指令安装：

安装插件

1
2
npm un hexo-swpp swpp-backedns --save # 如果安装了的情况下，卸载再重装可以直接安装最新版（最粗暴有效的方式（（
npm i hexo-swpp swpp-backends --save

我的swpp版本

swpp配置文件

    在根目录创建一个swpp.config.ts文件。

1
2
3
4
5
6
7
8
9
import { defineConfig, defineCompilationEnv } from 'swpp-backends';

defineConfig({
    compilationEnv: {
        DOMAIN_HOST: new URL('https://blog.ciraos.top'),
        SERVICE_WORKER: 'sw',
    },
})

配置项

    再在根目录的config.yml内加入如下配置：

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
swpp:
  # 是否启用，默认 false
  enable: true
  # 配置文件路径，以 `/` 结尾表示加载指定文件夹下的所有文件，注意文件夹中只能有配置文件，不能有其它文件及文件夹
  # config_path: 'swpp.config.ts'
  # 是否生成 sw
  # serviceWorker: true
  # 是否向所有 HTML 插入注册 sw 的代码
  # auto_register: true
  # 是否生成 DOM 端的 JS 文件并在 HTML 中插入 script
  # gen_dom: true
  # 生成的 diff 文件的路径（可以是绝对路径也可以是相对路径，使用相对路径时相对于网站发布目录），留空表示不生成（默认为 null）
  # gen_diff: './diff.json'
  # 是否在执行 hexo deploy 时自动执行 swpp 指令
  # auto_exec: false
  # 检查更新的网址，默认 "https://registry.npmjs.org"，注意不能以斜杠结尾
  # npm_url: 'https://registry.npmmirror.com'
  #
  # 排序规则。
  # sort_rules:
  # 该配置项是为了对 hexo 中的一些变量进行排序，避免每次生成 HTML 时由于这些变量的顺序变动导致生成结果不完全相同。
  # 下面给出的值为插件的缺省值，用户设置该项不会直接覆盖这些值，只有用户也声明 posts、pages 或 tags 时才会覆盖对应的值。
  # 其中 key 值为要排序的变量的名称，value 为变量排序时的依据，
  # 填 false 表示禁用该项排序，填 true 表示以 value 本身为键进行排序，填字符串表示以 value[tag] 为键进行排序。
  # sort_rules:
  #   posts: 'title'
  #   pages: 'title'
  #   tags: 'name'