vuepress - 如何使用 register-components 自定义组件目录“.vuepress/components"的位置?

2022-01-21 00:00:00 customization components vue.js vuepress

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

I tried to add custom directory of components in vuepress with plugin register/components but it seems not possible.

我试过了

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

有了这个架构(我想选择组件"目录)

with this architecture (I want to select "components" directory)

但它似乎不起作用，因为组件无法识别

But it seem doesn't work because the component is not recognized

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

I think that I wrote well my component in my base-button.md

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

Is that someone could help me to tell me steps to get there?

非常感谢

推荐答案

可以在enhanceApp.js中全局注册组件(应该位于/.vuepress/ 文件夹)，就像在 Vue 应用程序中注册它们一样.

You can register components globally in enhanceApp.js (which should be located in the /.vuepress/ folder) in the same way you register them in a Vue app.

enhanceApp.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)
}

相关文章