Skip to content

Commit 9c7fc68

Browse files
committed
chore: update
1 parent b01e543 commit 9c7fc68

File tree

3 files changed

+22
-8
lines changed

3 files changed

+22
-8
lines changed

README.md

Lines changed: 22 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -149,6 +149,28 @@ import Readme from '../README.md'
149149
</template>
150150
```
151151

152+
## `<script>` and `<style>`
153+
154+
Root-level `<script>` and `<style>` tags in Markdown files work just like they do in Vue SFCs, including `<script setup>`, `<style module>`, etc. The main difference here is that there is no `<template>` tag: all other root-level content is Markdown. Also note that all tags should be placed after the frontmatter:
155+
156+
```md
157+
---
158+
hello: world
159+
---
160+
161+
<script setup>
162+
const count = ref(0)
163+
</script>
164+
165+
## Markdown Content
166+
167+
The count is: {{ count }}
168+
169+
<button @click="count++">Increment</button>
170+
```
171+
172+
**Avoid `<style scoped>` in Markdown:** When used in Markdown, `<style scoped>` requires adding special attributes to every element on the current page, which will significantly bloat the page size. <style module> is preferred when locally-scoped styling is needed in a page.
173+
152174
## FAQ
153175

154176
### How does this compare to [@nuxt/content](https://content.nuxtjs.org/)?

playground/pages/index.md

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -9,7 +9,6 @@ Nuxt Page as Markdown
99
- Go to [/blog](/blog)
1010
- Go to [/about](/about)
1111
- Go to [/dynamic/hello](/dynamic/hello)
12-
- Go to [/readme](/readme)
1312
- Go to [/redirect](/redirect)
1413

1514
---

playground/pages/readme.vue

Lines changed: 0 additions & 7 deletions
This file was deleted.

0 commit comments

Comments
 (0)