这是我参与11月更文挑战的第1天，活动详情查看：2021最后一次更文挑战
各位久等了，不少朋友问 “小助手为啥还不更新 11 月的更文活动呢？”，这不就来了。
不过，除了跟进活动之外，这一版本还带来了重磅更新 —— 聚合平台。
1.0.0 版本，【掘金活动小助手】升级为【掘金扩展助手】，不再是单一功能的载体，而是变身为一个聚合平台，将围绕掘金社区的各类脚本聚合在一个市场里，可方便插拔。
我们直入主题，看看怎么使用。
使用说明书
安装油猴插件，Tampermonkey • 首页。无法下载？尝试使用油猴离线下载包 - Feishu Doc。
访问 掘金扩展助手 (greasyfork.org)，安装脚本。
当前版本预装了「更文活动小助手」，在安装脚本之后即可在个人主页看到活动进度。
同时，可以通过油猴脚本入口进入「扩展市场」。
看一看有啥需要的扩展功能，添加即可。
刷新掘金页面，看看效果吧。
平台每天自动检查更新，如果需要手动更新，进入扩展市场更新即可。
如何上架油猴脚本
将油猴脚本上架为平台脚本只需要三个简单步骤：
- 利用钩子
- 本地测试
- 更新扩展列表
利用钩子
打开任意页面时，平台都会运行已添加的扩展。那如果只想在掘金页进行一些操作，要怎么处理呢？
平台提供了两个路由相关的钩子:
onLoaded: 打开掘金页面时执行onRouteChange(prevRouterPathname, currentRouterPathname): 掘金页面间切换时执行
一般会有如下场景：
- 无需打开掘金页面进行一些操作，一些后台操作，例如：自动签到、定时发布文章。
- 只在掘金页面中进行操作，可以利用
onLoaded在页面打开时进行。由于掘金部分页面使用的是单页路由，不会重新加载页面，利用onRouteChange可以捕获页面间切换的时机，在切换进指定页面时进行操作。
举个例子来说明：
(function () {
// GM_xmlhttpRequest(...)
alert("后台检查"); // 打开任意页面时都做一下，查查看今天有没有签到、文章有没有被推荐上首页了...
function isInProfilePage (pathname) {
return /\/user\/(\d+)(?:\/|$)/.test(pathname);
}
return {
onLoaded () {
// 进入掘金页面时弹个提示
alert("欢迎来到掘金");
},
onRouteChange(prev, current) {
// 从沸点等页面切换进个人主页
if (!inProfilePage(prev) && inProfilePage(current)) {
alert("已进入个人主页");
}
},
isOffShelf: new Date().valueOf() < 1638288000000 // 只在 2021-12-01 日之前运行扩展
}
})()
或许你已经在代码中做了路由相关的判断，那么直接保持原有脚本就好了，甚至不需要返回任何东西。
简单来说，油猴脚本可以通过 @include 和 @match 来指定运行站点，但扩展助手开放了所有站点，同时提供 onLoaded 和 onRouteChange 来做掘金范围内的路由支持。
另外还有一个额外属性
isOffShelf: 是否运行扩展，可用于一些有时段要求的场景，例如限时活动
本地测试
打开扩展市场，通过顶部的 “添加本地扩展” 加载本地代码，刷新掘金页验证.
更新扩展列表
1. Fork 脚本市场仓库 curly210102/juejin-enhancer-extensions: 掘金小助手扩展集合 (github.com)
2. 在 extensions 目录下增加一个目录，目录中新建一个 index.md 文件
---
title: 扩展名称
description: 简要介绍
version: 0.0.1
rawURL: https://gitee.com/curlly-brackets/juejin-post-tracker/raw/main/main.user.js
preview: /preview.png
author: 作者名
---
扩展说明...
Markdown YAML 说明：
title: 扩展名称description: 一句话简要介绍version: 版本号rawURL: 脚本代码的可访问链接，供平台下载代码。如果是托管在 github 上建议做 gitee 同步，给 gitee 链接preview: 缩略介绍图，将图片放到public目录下，或者直接给远程地址author: 作者名
这里没有提供用户反馈相关的配置，最好是在正文部分增加一些说明。
3. 将新增的目录名添加到 juejin.extension.json ，选择对应的分类添加。
{
"activity": {
"title": "活动",
"extensions": ["juejin-post-tracker"]
},
"efficient": {
"title": "效率工具",
"extensions": []
},
"data": {
"title": "数据统计",
"extensions": []
},
"others": {
"title": "其他",
"extensions": []
}
}
4. 查看效果
yarn
yarn dev
提交 PR，审核通过后会自动上架。
如果需要更新版本，修改 Markdown 中的 version 提交 PR 即可。
如何开发扩展
建议先以油猴脚本的形式开发，开发完成后再接入平台。
油猴脚本开发的完整教程可以看 【轻松上手】油猴脚本开发 - 掘金 (juejin.cn)
如果想要使用现代化的前端技术来写，推荐使用 create-tampermonkey - npm (npmjs.com) 脚手架启动项目。支持模块化、ESNext、TypeScript、CSS Module、ESLint，同时提供油猴脚本开发环境、支持自动提取 UserScript Header，是开发油猴脚本的一大利器。
使用 create-tampermonkey 启动的项目，如需使用平台提供的钩子，在 main.js 最后加上 export default 即可。
export default {
onLoaded () {},
onRouteChange() {}
};
最后
👏 感谢社区里各位朋友宝贵的问题反馈和优化建议，有任何问题和建议欢迎在评论区留言。
🔥 也欢迎热爱技术的朋友们贡献代码，一起参与项目优化。
希望用的愉快，玩的开心～
