halo-admin

History

Ryan Wang a396aad87f feat: add editor extension point (#781 ) #### What type of PR is this? /kind feature #### What this PR does / why we need it: 添加编辑器的扩展点，用于扩展集成其他编辑器。定义一个扩展点的方式： ```ts export default definePlugin({ extensionPoints: { "editor:create": () => { return [ { name: "stackedit", displayName: "StackEdit", component: markRaw(StackEdit), rawType: "markdown", }, ]; }, }, }); ``` 其中 `component` 字段即编辑器组件对象，需要包含 `raw`、`content` 的 prop。 #### Which issue(s) this PR fixes: Fixes https://github.com/halo-dev/halo/issues/2881 #### Screenshots: <img width="1664" alt="image" src="https://user-images.githubusercontent.com/21301288/208406097-60258cba-cff6-436f-bd50-6d8c27ea9a53.png"> <img width="1662" alt="image" src="https://user-images.githubusercontent.com/21301288/208406174-d4649365-3448-4581-a452-f9781502eac6.png"> <img width="1920" alt="image" src="https://user-images.githubusercontent.com/21301288/208407570-db10e956-cd6a-4e0d-801e-b794ad0261bc.png"> <img width="1920" alt="image" src="https://user-images.githubusercontent.com/21301288/208407607-fd595957-5278-40c2-a3b5-fb73c1de429c.png"> #### Special notes for your reviewer: 目前可用于测试的插件： 1. [plugin-stackedit-1.0.0-SNAPSHOT.jar.zip](https://github.com/halo-dev/console/files/10258488/plugin-stackedit-1.0.0-SNAPSHOT.jar.zip) 2. [plugin-bytemd-1.0.0-SNAPSHOT.jar.zip](https://github.com/halo-dev/console/files/10258490/plugin-bytemd-1.0.0-SNAPSHOT.jar.zip) 测试方式： 1. Console 需要 `pnpm build:packages`。 2. 在 Console 的插件管理上传以上插件。 3. 新建若干文章，使用不同的编辑器。 4. 检查是否能够正常发布和编辑。 5. 检查编辑的时候，是否正确使用了之前的编辑器。 6. 检查主题端是否渲染正常。一些实现细节： 1. 为了支持更新文章时能够选择发布时的编辑器，会在 post 的 `metadata.annotations` 添加一条 `content.halo.run/preferred-editor` 用于标记使用的什么编辑器。如果编辑器不存在，会使用 content 的 `rawType` 来匹配。 2. 目前没有全局默认编辑器设置，只能在新建文章的时候选择。 #### Does this PR introduce a user-facing change? ```release-note Console 端支持扩展集成其他编辑器 ```	2 years ago
..
editor.md	feat: add editor extension point (#781 )	2 years ago

feat: add editor extension point (#781 )

#### What type of PR is this?

/kind feature

#### What this PR does / why we need it:

添加编辑器的扩展点，用于扩展集成其他编辑器。

定义一个扩展点的方式：

```ts
export default definePlugin({
  extensionPoints: {
    "editor:create": () => {
      return [
        {
          name: "stackedit",
          displayName: "StackEdit",
          component: markRaw(StackEdit),
          rawType: "markdown",
        },
      ];
    },
  },
});
```

其中 `component` 字段即编辑器组件对象，需要包含 `raw`、`content` 的 prop。

#### Which issue(s) this PR fixes:

Fixes https://github.com/halo-dev/halo/issues/2881

#### Screenshots:

<img width="1664" alt="image" src="https://user-images.githubusercontent.com/21301288/208406097-60258cba-cff6-436f-bd50-6d8c27ea9a53.png">
<img width="1662" alt="image" src="https://user-images.githubusercontent.com/21301288/208406174-d4649365-3448-4581-a452-f9781502eac6.png">
<img width="1920" alt="image" src="https://user-images.githubusercontent.com/21301288/208407570-db10e956-cd6a-4e0d-801e-b794ad0261bc.png">
<img width="1920" alt="image" src="https://user-images.githubusercontent.com/21301288/208407607-fd595957-5278-40c2-a3b5-fb73c1de429c.png">

#### Special notes for your reviewer:

目前可用于测试的插件：

1. [plugin-stackedit-1.0.0-SNAPSHOT.jar.zip](https://github.com/halo-dev/console/files/10258488/plugin-stackedit-1.0.0-SNAPSHOT.jar.zip)
2. [plugin-bytemd-1.0.0-SNAPSHOT.jar.zip](https://github.com/halo-dev/console/files/10258490/plugin-bytemd-1.0.0-SNAPSHOT.jar.zip)

测试方式：

1. Console 需要 `pnpm build:packages`。
2. 在 Console 的插件管理上传以上插件。
3. 新建若干文章，使用不同的编辑器。
4. 检查是否能够正常发布和编辑。
5. 检查编辑的时候，是否正确使用了之前的编辑器。
6. 检查主题端是否渲染正常。

一些实现细节：

1. 为了支持更新文章时能够选择发布时的编辑器，会在 post 的 `metadata.annotations` 添加一条 `content.halo.run/preferred-editor` 用于标记使用的什么编辑器。如果编辑器不存在，会使用 content 的 `rawType` 来匹配。
2. 目前没有全局默认编辑器设置，只能在新建文章的时候选择。

#### Does this PR introduce a user-facing change?

```release-note
Console 端支持扩展集成其他编辑器
```

editor.md

feat: add editor extension point (#781 )