如何解决如何将CK Editor 5与Sapper / Svelte3集成?
我试图将CK Editor 5集成到我的sapper项目中,如下所示:
<script>
import { onMount } from 'svelte';
import ClassicEditor from '@ckeditor/ckeditor5-build-classic';
onMount( () => {
ClassicEditor.create( document.querySelector( '#editor' ) )
.then( editor => {
console.log( editor );
} )
.catch( error => {
console.error( error );
} );
});
</script>
<textarea id='editor'></textarea>
我收到以下错误:
ReferenceError:未定义窗口 在对象。 (F:\ project \ node_modules @ ckeditor \ ckeditor5-build-classic \ build \ ckeditor.js:5:3314) 在Module._compile(内部/模块/cjs/loader.js:1147:30) 在Object.Module._extensions..js(内部/模块/cjs/loader.js:1167:10) 在Module.load(internal / modules / cjs / loader.js:996:32) 在Function.Module。 load(内部/模块/cjs/loader.js:896:14) 在Module.require(internal / modules / cjs / loader.js:1036:19) 在要求时(内部/模块/cjs/helpers.js:72:18) 在对象。 (F:\ project_ sapper \ dev \ server \ server.js:8:1) 在Module._compile(内部/模块/cjs/loader.js:1147:30) 在Object.Module._extensions..js(internal / modules / cjs / loader.js:1167:10)
服务器崩溃
如何在sapper / svelte3项目中正确集成CK Editor 5?
解决方法
由于服务器上没有窗口,因此您需要使用dynamic import。
<script>
import { onMount } from 'svelte'
let ClassicEditor
onMount(async ()=> {
const module = await import('@ckeditor/ckeditor5-build-classic')
ClassicEditor = module.default
ClassicEditor.create( document.querySelector('#editor') )
.then( editor => {
console.log( editor );
} )
.catch( error => {
console.error( error );
} );
})
</script>
<textarea id='editor'></textarea>
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。