Introduction

Introduction Nextra v3

Nextra v3, released on September 28, 2024, is a significant update to the Nextra framework, enhancing its capabilities for building content-focused websites atop Next.js.

A major advancement in this version is the transition to MDX 3, enabling seamless integration of React components, variable interpolation, and LaTeX within the table of contents.

The update also introduces a new styling approach for code blocks, aligning with Next.js aesthetics, and incorporates ‘shikiji’ for syntax highlighting, replacing ‘shiki’.

To enhance customization, Nextra v3 removes support for ‘_meta.json’ files, advocating the use of _meta.{js,jsx,ts,tsx} instead, allowing for more dynamic configurations.

The release also discontinues certain components and exports, such as Steps, Callout, Tabs, Tab, Cards and ‘FileTree’, which are now available from ‘nextra/components’.

package.json
{
  "name": "nextra-v3-template",
  "version": "0.1.0",
  "description": "Nextra v3 Template with configs and folders using app router",
  "private": true,
  "scripts": {
    "dev": "next dev",
    "build": "next build",
    "start": "next start",
    "lint": "next lint"
  },
  "dependencies": {
    "lucide-react": "^0.469.0",
    "next": "^15.1.3",
    "nextra": "^3.3.1",
    "nextra-theme-docs": "^3.3.1",
    "react": "^19.0.0",
    "react-dom": "^19.0.0",
    "sass": "^1.83.0",
    "sharp": "^0.33.5"
  },
  "devDependencies": {
    "@eslint/eslintrc": "^3",
    "@types/node": "^20",
    "@types/react": "^19",
    "@types/react-dom": "^19",
    "eslint": "^9",
    "eslint-config-next": "15.1.3",
    "postcss": "^8",
    "tailwindcss": "^3.4.1",
    "typescript": "^5"
  }
}