BuptStEve/vuepress-plugin-demo-code

不能直接使用 .vuepress/components/ 里定义的组件吗

KakashiZs opened this issue · 7 comments

KakashiZs commented

/.vuepress/components/ 里定义的组件已经默认全局注册了，但是直接引用无效，例如如下代码：

:::
<m-button />
:::

其中<m-button>是我定义在 .vuepress/components/ 文件夹里的组件

BuptStEve commented

支持啊，你给个复现仓库？

KakashiZs commented

这个仓库： https://github.com/KakashiZs/vuepress-test-demo
npm run docs:dev 运行之后可以直接看效果
运行的就是 docs/readme.md 这个文件，想要引用 docs/.vuepress/components/ 下面定义好的MButton组件，但是只把组件显示了出来，没有出现代码块
是我写的有问题吗

BuptStEve commented

这个仓库： https://github.com/KakashiZs/vuepress-test-demo
npm run docs:dev 运行之后可以直接看效果
运行的就是 docs/readme.md 这个文件，想要引用 docs/.vuepress/components/ 下面定义好的MButton组件，但是只把组件显示了出来，没有出现代码块
是我写的有问题吗

老哥你要加上这个标志呀...

image

KakashiZs commented

抱歉，是我搞错了,要在:::之后加上 demo之外，还要是在 <template> 标签中引入自己的组件，这样才会正常引用自己的组件的同时显示代码块。我应该多读读老哥你的文章和代码了👍

KakashiZs commented

👍 谢谢老哥，我去看看

BuptStEve commented

应该是这个 https://v1.vuepress.vuejs.org/zh/guide/basic-config.html#%E5%BA%94%E7%94%A8%E7%BA%A7%E5%88%AB%E7%9A%84%E9%85%8D%E7%BD%AE

export default ({
  Vue, // VuePress 正在使用的 Vue 构造函数
  options, // 附加到根实例的一些选项
  router, // 当前应用的路由实例
  siteData // 站点元数据
}) => {
  // ...做一些其他的应用级别的优化

  // 在这里注册组件什么的 
  Vue.use(fooComponent)
}