posts/start-vitepress/

[utterances-bot]

Create a document with VitePress | miyauci.me

Introduce the basic usage of VitePress,multilingual support, homepage layout, meta tag injection, custom CSS, custom component and so on.

https://miyauchi.dev/posts/start-vitepress/?utterances=0cda0023ad4a6e8d13386ae6T6bTd4r%2BFA97wAONCPSYj6nGhZ%2BGAi4is5QF6nghTFWFh07vd6wkTqoMdHVLLYU9CSQ6kW84reyDjXJf1fpWQR%2FMuGkJCWsB6qcPIdg6C6vskQkKHhZW0eJwV18%3D

[prashantnirgun]

is there is any way to embed vue code into .md file like this instead of importing component and use it. Code is bellow

# Training
## what is count ? {{ count}}
<template>
  <div>{{count}}</div>
</template>
<script setup>
  import { ref } from 'vue';  
  const count = ref(10);
</script>

[TomokiMiyauci]

@prashantnirgun "vitepress": "^0.22.2"

You try the following.

# Training
## what is count ? {{ count }}

<script setup>
 import { ref } from 'vue';
 const count = ref(0)
</script>

<button v-on:click="count +=1">inc</button>

[prashantnirgun]

No let me re-phase it I want can we use markdown and templates both in test.md file. I checked it works without template that is fine.

[TomokiMiyauci]

@prashantnirgun I'm not sure what you want to do. Do you mean you want to use the template tag itself in .md files?　

[prashantnirgun]

Yes is it possible ?

[TomokiMiyauci]

@prashantnirgun You can do this.

# Training
## what is count ? {{ count}}

<component is="template">
  <div>{{count}}</div>
</component>

<script setup>
  import { ref } from 'vue';
  const count = ref(10);
</script>

[keanesnow98]

Actually, this is apart from code, but can I see scroll bar? This is all so inconvenient to use mouse scroll every time.