Installation

Le chemin le plus simple

Dans une application Nuxt 4, installez le package puis déclarez son module.

bun add @vevedh/nfz-notion-markdown-editor

// nuxt.config.ts
export default defineNuxtConfig({
  modules: ['@vevedh/nfz-notion-markdown-editor/module']
})

Après redémarrage de Nuxt, le composant NfzNotionMarkdownEditor est disponible dans vos pages et composants.

<script setup lang="ts">
const markdown = ref('# Mon premier document')
</script>

<template>
  <NfzNotionMarkdownEditor v-model="markdown" />
</template>

C’est suffisant pour commencer à écrire.

Utiliser le package comme Nuxt Layer

Si votre projet préfère les Layers Nuxt, vous pouvez étendre directement le package :

export default defineNuxtConfig({
  extends: ['@vevedh/nfz-notion-markdown-editor']
})

Le Layer active le profil complet prévu par le projet.

Prérequis

Le projet est conçu pour Nuxt 4, Vue 3.5+ et Node.js 22+. La toolchain de développement du dépôt utilise la version exacte de Bun déclarée dans package.json.

TIP

Dans votre propre application, vous n’avez pas besoin de reproduire toutes les commandes de maintenance du dépôt. Installez le package, ajoutez le module et commencez par un simple v-model.

Vérifier que tout fonctionne

Lancez votre application :

bun run dev

Ouvrez ensuite la page contenant l’éditeur. Si la zone d’écriture et la barre d’outils apparaissent, l’intégration de base est terminée.

En cas de problème, consultez le guide de dépannage.