Open ynechaev opened 8 months ago
I am exposing lexical-vue with the following plugin:
// plugins/lexical.client.ts import { useEditor, LexicalComposer, LexicalContentEditable, LexicalPlainTextPlugin, } from 'lexical-vue' export default defineNuxtPlugin(nuxtApp => { nuxtApp.vueApp.component('LexicalComposer', LexicalComposer) nuxtApp.vueApp.component('LexicalContentEditable', LexicalContentEditable) nuxtApp.vueApp.component('LexicalPlainTextPlugin', LexicalPlainTextPlugin) return { provide: { useEditor, } } })
So inside the component when I try using it as following:
<template> <ClientOnly> <LexicalComposer :initial-config="config"> <LexicalPlainTextPlugin> <template #contentEditable> <LexicalContentEditable /> </template> <template #placeholder> <div> What do you want to write about today? </div> </template> </LexicalPlainTextPlugin> </LexicalComposer> </ClientOnly> </template> <script setup> const { $useEditor: useEditor, } = useNuxtApp() const config = { editable: true, theme: { }, onError(error) { console.error(error) }, } const editor = useEditor() // Two-way binding const content = ref('') </script>
I get an error: useEditor is not a function and trace shows <LexicalComposer /> is required error message (which is a bit misleading, because it throws when editor in underlying function is null
useEditor is not a function
<LexicalComposer /> is required
Have you figured out a way to implement it in Nuxt 3?
I am exposing lexical-vue with the following plugin:
So inside the component when I try using it as following:
I get an error:
useEditor is not a function
and trace shows<LexicalComposer /> is required
error message (which is a bit misleading, because it throws when editor in underlying function is null