javascript - 如何正确编写 vuepress 插件？

Question

我正在尝试编写一个 Vuepress 插件来利用 App Level 增强并安装一个 Vue 插件。但我似乎无法让它发挥作用。你能看看下面的代码，看看有什么问题吗？

---

{.vuepress/config.js}
module.exports = {
  plugins: [
    require('./builder.plugin.js')
  ]
}

---

{.vuepress/builder.plugin.js}
module.exports = (option, ctx) => {
  return {
    enhanceAppFiles: [{
      name: 'builder-plugin',
      content: `export default ({ Vue }) => {
        Vue.component('b-header', {
          name: 'b-header',
          template: '<div id="header"><slot /></div>'
        })
      }`
    }]
  }
}

---

{README.md}
# Introduction
<b-header>Test from component</b-header>

我得到的最后一个错误是:

Unknown custom element: <b-header> - did you register the component correctly? For recursive components, make sure to provide the "name" option.

Answer 1

我真的找到了答案。上面的方法不起作用，因为我使用插件将客户端站点代码与运行时代码混合在一起。

诀窍是使用 enhanceAPP 钩子(Hook)。引用:https://vuepress.vuejs.org/guide/basic-config.html#theme-configuration