Home » vue » Vuepress theme in vue template

Vuepress theme in vue template

Posted by: admin November 26, 2021 Leave a comment

Questions:

I am working on a vue project and I need to embed a documentation inside a vue template ideally. I considered using vuepress for making documentation as it has a full-fledged theme for documentation which is perfect for the kind of documentation I want and also supports markdown to write documentation. I tried using vuepress but only includes components written in .vuepress/components folder. Is there a way I can include other vue components of my project inside the markdown files or output the markdown files as vue templates instead of static html files.

Answers:

You can use the string tag in your markdown file just as you would do in a regular vue project with webpack. For example:

on README.md:

# This is a title
## This is a subtitle
<my-component></my-component>
> My name is {{ name }}

<script>
import myComponent from '../myOtherFolder/MyComponent'
export default {
  components: {
    'my-component': myComponent
  },
  data: function() {
    return {
      name: 'John'
    }
  }
}
</script>