Yank Note 支持 “JavaScript 插件” 和 “自定义 CSS 样式” 功能。如果你想将自己编写的插件和样式分享给其他人使用，那么你可以将它们制作成扩展的形式分享出去。
扩展是由基础信息、JavaScript 插件、Css 样式和资源组合在一起构成，使用 NPM 包的形式进行分发。
graph TB
Meta[Meta: package.json] --> Extension[(Extension)]
Plugin[Plugin: index.js] --> Extension
Style[Style: style.css] --> Extension
Themes[Themes: a.css, b.css] --> Extension
Resources[Resources: a.png, b.ttf] --> Extension
插件相关开发可参考插件开发指南，自定义样式可以参考自定义样式，元信息编写规则参考本文后面的章节。
这里有一个扩展示例仓库，可以作为整体参考。
扩展包根目录下请包含 README.md 和 CHANGELOG.md 文件，方便在扩展管理中对用户展示。
扩展的信息保存在 package.json 中。
package.json 中字段可以参考 package.json | npm Docs，其中 name, version, description, homepage, author, license 字段是必须的。
除了上述字段外，你可能还需要额外定义如下字段：
| 字段 | 类型 | 说明 | 示例 |
|---|---|---|---|
displayName |
必须 string |
显示名 | Hello World |
icon |
必须 string |
图标 | ./icon.png |
engines |
必须 { 'yank-note': string } |
兼容的 Yank Note 版本范围 | {"node": ">=14.6.0", "yank-note": "^3.30.0"} |
main |
可选 string |
JavasScript 插件文件 | ./dist/index.js |
style |
可选 string |
CSS 样式文件 | ./dist/style.css |
themes |
可选 Array<{ name: string, css: string }> |
主题样式文件。 | [{"name": "Red", "css": "./themes/demo1.css"}] |
国际化
如果要使 displayName 和 description 字段支持多语言，可以使用 <key>_<LANGUAGE> 形式定义多个。LANGUAGE 需要大写。
{
"displayName": "HelloWorld",
"displayName_EN": "HelloWorld",
"displayName_ZH-CN": "你好世界",
"description": "hello world!"
"description_ZH-CN": "你好世界！",
}JavaScript 入口文件在 package.json 中的 main 字段中定义。
因为插件是在浏览器中运行，所以不支持 require 或 import 语法，需要提前打包好。
- 在
package.json中的style中定义插件样式文件，和插件一并加载。 - 在
package.json中的themes中定义主题样式文件，用户在“设置”中选取使用。
Yank Note 扩展目录 会加入应用静态文件查找目录。
使用静态资源时候需要注意需要路径是否拼接正确。可以使用相对路径或调用 getExtensionBasePath 方法获取路径。
开发插件时候建议在 Chrome 浏览器中打开 Yank Note，方便调试。打开方法：右键点击托盘图标 --> 点击“浏览器中打开”
- 使用脚手架创建项目:
yarn create yank-note-extension。包名建议以yank-note-extension-开头。 - 进入项目后，安装依赖:
yarn install - 链接当前目录到 Yank Note 扩展目录:
yarn run link-extension - 启动开发:
yarn run dev - 刷新浏览器页面
- 点击“工具” --> “扩展中心”，启用开发中的扩展
现在你应该能在“状态栏”菜单中看到“你好世界”的菜单了。
当你开发完成后，如果你想要将扩展给别人使用，有两种方式：
- 手动分发：告知用户下载方式及安装步骤。用户将扩展放置到Yank Note 扩展目录中，然后在扩展管理面板里面启用。
- 使用 Yank Note 扩展注册中心分发，用户可以直接在扩展管理面板中下载/升级。请访问 yank-note-registry 了解更多。