Get Started
Installation
Get started with Nuxt Content by creating a new project or adding it to an existing Nuxt application.
Add to a project
⚠️ Nuxt Content requires
ssr: true
(default value) to be set in Nuxt Config. Nuxt applications with ssr: false
will generate as a Single-Page Application, which is currently incompatible with prerendering Nuxt Content files.You can add Nuxt Content at anytime during your Nuxt project development by installing the @nuxt/content
module:
npx nuxi@latest module add @nuxt/content@2
Then, add @nuxt/content
to the modules
section of nuxt.config.ts
:
nuxt.config.ts
export default defineNuxtConfig({
modules: [
'@nuxt/content'
],
content: {
// ... options
}
})
Create content
Place your markdown files inside the content/
directory in the root directory of your project.
content/index.md
# Hello Content
The module automatically loads and parses them.
Render pages
To render content pages, add a catch-all route using the ContentDoc
component:
pages/[...slug].vue
<template>
<main>
<ContentDoc />
</main>
</template>
⚠️ If you have an
app.vue
file at the project's root, ensure that you include <NuxtPage />
in its template to render pages.⚠️ Content v2 requires Nuxt 3. If you are using Nuxt 2, checkout Content v1 documentation.
👉 Next step is to head over the Writing section to learn how to use Nuxt Content.