Roadmap

Our envision and roadmap

New Project

Before getting started, please make sure to have installed the recommended setup:

You can start a fresh Nuxt Content project with:

npx

npx nuxi init content-app -t content

Install the dependencies in the content-app folder:

yarn

yarn install

Now you'll be able to use yarn dev to start your Nuxt content app in development mode:

yarn

yarn dev

✨ Well done! A browser window should automatically open for http://localhost:3000

👉 Next step is to head over the Writing section to learn how to use Nuxt Content.

Add to a project

You can add Nuxt Content at anytime during your Nuxt project development by installing the @nuxt/content module:

yarn

yarn add --dev @nuxt/content

Then, add @nuxt/content to the modules section of nuxt.config.ts:

nuxt.config.ts

import { defineNuxtConfig } from 'nuxt'export default defineNuxtConfig({  modules: [    '@nuxt/content'  ],  content: {    // https://content.nuxtjs.org/api/configuration  }})

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>

⚠️ 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.