@nonoim/editor-vue

The official Vue 3 adapter for nonoMark. Existing @nonoim/editor projects can migrate by changing only the package name.

import { NonoEditor } from '@nonoim/editor-vue';
import '@nonoim/editor-vue/style.css';

Use :import-remote-images="importRemoteImages" to let the host import http/https images found in the current Markdown or HTML paste. Successful assets should return the input reference id; storage and download security remain host responsibilities.

For admin pages that must mount before Tiptap finishes loading, switch only the import path:

import { NonoLazyEditor, preloadNonoEditor } from '@nonoim/editor-vue/lazy';

NonoLazyEditor accepts the same props and v-model. It shows an editable Markdown textarea while loading the full editor. Call preloadNonoEditor() on route intent, menu hover, or during browser idle time to warm the async chunk before navigation.

The toolbar includes a Gallery button by default. Images without captions use standard Markdown image lines; images with captions use standard HTML <figure>, <img>, and <figcaption> elements. Alternative text (alt) and visible captions are stored separately:

<NonoEditor
  v-model="content"
  :enable-gallery="true"
  @gallery-pick-image="({ onSelect }) => mediaLibrary.open(onSelect)"
>
  <template #gallery-picker="{ onSelect }">
    <MyMediaLibraryPicker @confirm="onSelect" />
  </template>
</NonoEditor>

Users choose 2, 3, or 4 images, reorder them, and edit alt and optional captions before insertion. The picker copies an asset's default alt into the article; editing it does not change the library asset or other articles. Empty alt stays empty. uploadImages can provide the upload action in the dialog. Set :enable-gallery="false" to hide the tool.

In visual mode, select an image and click Image properties beside it. The panel edits only that occurrence, including when the same URL appears more than once. Changing a caption never automatically replaces alt. Use caption as alt explicitly copies it when desired; apply, cancel, Escape, undo and redo are supported. URL and title are preserved through save/reopen and source/visual switching.