v4.0.0
🎉 Docus v4
Even though Docus v3 was a recent release, moving to the native Nuxt CLI in v4 allows us to benefit from its performance improvements and ongoing enhancements. The only breaking changes are related to how you run and build your documentation projects.
⚡Native Nuxt CLI Integration
Docus v4 transitions from a custom CLI tool to a Nuxt layer-based approach that leverages the official Nuxt CLI (nuxi).
- Monorepo structure: The main Docus repository is now a monorepo containing two packages:
docus: The Nuxt layer you add to your project for docs features and UI.create-docus: The CLI tool to create new Docus projects (replaces the previous CLI).
- Nuxt 4 compatibility: Support for Nuxt 4.
- Flexible templates: Choose between
defaultandi18nstarter templates with the-tflag when creating a new project (more details below about i18n).
Usage
# ✅ New way (v4)
npx create-docus my-docs
cd my-docs
npm run dev
# ❌ Old way (v3)
npx docus init my-docsGenerated project (no changes)
my-docs/
├── content/ # Your markdown content
│ ├── index.md # Homepage
│ └── docs/ # Documentation pages
├── public/ # Static assets
└── package.json # Dependencies and scripts
You can still use any feature or file of a classical Nuxt project:
my-docs/
├── app.config.ts # App configuration
├── nuxt.config.ts # Nuxt configuration (add extra modules, components, etc.)
├── app/ # App directory
│ ├── components/ # Components (add your own components)
│ ├── layouts/ # Layouts (add your own layouts)
│ └── pages/ # Pages (add your own pages)
└── server/ # Server-side code (add your own server-side code)
🌍 I18N Integration
Docus v4 introduces native internationalization support based on the @nuxtjs/i18n module
- Built-in i18n module: Native integration with
@nuxtjs/i18n - Dynamic locale routing: Automatic URL prefixing with language codes (
/en/docs,/fr/docs) - Content collections per locale: Separate content management for each language
- Language switcher: Built-in component for switching between locales
Content Organization
With i18n:
content/
├── en/
│ ├── index.md
│ └── docs/
│ └── getting-started.md
├── fr/
│ ├── index.md
│ └── docs/
│ └── getting-started.md
Without i18n:
content/
├── index.md
└── docs/
└── getting-started.md
Configuration
Tip
The only thing you need to do to enable i18n is to add it in your nuxt.config.ts and define the locales in the i18n configuration.
Docus will automatically generate the content collections based on the locales defined in the i18n configuration and will use your content architecture to generate the routing.
export default defineNuxtConfig({
modules: ['@nuxtjs/i18n'],
i18n: {
defaultLocale: 'en',
locales: [
{ code: 'en', name: 'English' },
{ code: 'fr', name: 'Français' }
],
}
})⚠️ Breaking Changes
CLI Command Changes
| v3 | v4 |
|---|---|
npx docus init my-docs |
npx create-docus my-docs |
npx docus dev |
nuxt dev --extend docus |
npx docus build |
nuxt build --extend docus |
Note
It's even recommanded to directly extend the Docus layer in your nuxt.config.ts with extends: ['docus'] instead of using the CLI commands but both will work.
Full Changelog: v3.0.5...v4.0.0