feat(plugin-md-power): add demo syntax

[pengzhanbo]

Warning

此 PR 处于 试验性研究 阶段

描述

增加新的 嵌入语法 和 容器语法 以 支持向 markdown 中 插入 代码演示：

• normal: 普通前端代码演示， html + js/ts + css/less/sass/stylus
• vue: vue 组件代码演示， .vue 或者 .ts/.js + csscss/less/sass/stylus
• markdown: markdown 代码演示

此功能用于代替 vuepress-plugin-md-enhance 中的 demo 功能。
该插件对于 demo 功能的实现，基于实际的使用场景的实践，与预期不符合，因此重新进行设计。

嵌入语法

<!-- 普通前端代码 -->
@[demo](./xxx.html)
@[demo title="示例" desc="示例描述"](./xxx.html)

<!-- vue 组件 -->
@[demo vue](./xxx.vue)
@[demo vue title="示例" desc="示例描述"](./xxx.vue)
@[demo vue](./xxx.ts)
@[demo vue](./xxx.js)

<!-- markdown -->
@[demo markdown](./xxx.md)
@[demo markdown title="示例" desc="示例描述"](./xxx.md)

容器语法

::: demo vue
```vue
vue code
```
:::

:::demo vue title="示例" desc="示例描述"
```vue
vue code
```
:::

:::: demo vue
::: code-tabs
@tab Component.ts
```ts/js
import { defineComponent } from 'vue'

export default defineComponent({
  // code
})
```
@tab style.css
```css/less/scss/stylus
styles code
```
:::
::::

此语法在 node 编译时预处理组件，不需要在 浏览器运行时额外加载如 babel 等依赖。

---

预览

普通前端代码演示

vue 组件代码演示