Сниппет для Quill в Next.js без лишнего SSR

Сниппет для Quill в Next.js без лишнего SSR
Когда один и тот же WYSIWYG-редактор нужен и для ввода, и для просмотра, важно не тащить его на сервер и не смешивать состояние заметки с состоянием самого Quill. В этом фрагменте редактор грузится только в браузере, а highlight.js подключается отдельно для подсветки кода.

"use client";

import dynamic from "next/dynamic";
import hljs from "highlight.js";

if (typeof window !== "undefined") {
  window.hljs = hljs;
}

const ReactQuill = dynamic(
  async () => (await import("react-quill-new")).default,
  { ssr: false }
);


Учтите: такой подход подходит только для client-side редактора; если вам нужен контент на сервере без гидрации, придется отдельно продумывать viewer и формат хранения HTML.

https://habr.com/ru/articles/1101222/
Подписаться на канал Открыть в Telegram