vue.js - vuepress - 如何使用 register-components 自定义组件目录“.vuepress/components”的位置？

Question

我尝试使用插件注册/组件在 vuepress 中添加组件的自定义目录，但似乎不可能。

我试过了

module.exports = {
  title: 'Hello VuePress',
  description: 'Just playing around',
  plugins: [
   [
     'register-components',
     {
       componentDir: '../components'
     }
   ]
  ]
}

使用这种架构（我想选择“组件”目录）

但它似乎不起作用，因为该组件未被识别

我认为我在我的 base-button.md 中写得很好

有人可以帮我告诉我到达那里的步骤吗？

非常感谢

标签： vue.jscomponentscustomizationvuepress

Answer 1

您可以像在 Vue 应用程序中注册组件一样，在全局中注册组件enhanceApp.js（应该位于/.vuepress/文件夹中）。

增强应用程序.js

import BaseButton from '../../components/BaseButton'

export default ({
  Vue, // the version of Vue being used in the VuePress app
  options, // the options for the root Vue instance
  router, // the router instance for the app
  siteData // site metadata
}) => {
  Vue.component('BaseButton', BaseButton)
}