Using Nuxt3 and toast-ui Editor.
plugins/tui-editor.client.ts
import '@toast-ui/editor/dist/toastui-editor-viewer'
import { Editor } from '@toast-ui/vue-editor'
export default defineNuxtPlugin((nuxtApp) => {
return {
provide: {
editor: Editor,
},
}
})
components/DetailArea.client.vue
export default defineComponent({
setup() {
const { $editor } = useNuxtApp()
const Editor = $editor
console.log(Editor) // {name: 'ToastuiEditor', mixins: Array(1), props: {…}, watch: {…}, mounted: ƒ, …}
}
})
I want to use Editor as a component.
Second, I've tried it within components.
components/DetailArea.client.vue
import '@toast-ui/editor/dist/toastui-editor-viewer'
import { Editor } from '@toast-ui/vue-editor'
export default defineComponent({
setup() {
const editor = new Editor({
el: '#detail_viewer'
})
}
})
However, a 500 internal error occurred and a 'self is not defined' error message was seen.