前端 各位佬 CKEditor5 在 vue3 vite 环境下的源码自定义构建模式 添加了 htmlSupport 这个配置 好像不起作用 有遇到同样问题的佬吗

28 天前
 weiqipeng

官方文档: [https://ckeditor.com/docs/ckeditor5/latest/installation/advanced/alternative-setups/integrating-from-source-vite.html#running-the-editor-method-1]

不使用 htmlSupport 这个配置 在源代码编辑模式会自动把 css 的内联 style 自动过滤 预防漏洞攻击 需求就是 关闭这个自动过滤 但是发现在自定义构建模式下不起作用

直接使用在线选好功能打包之后再引入是没有问题的 但后续更新麻烦 所以想直接使用源码构建方式

版本: 41.4.1

我的代码:

editor.js



import { ClassicEditor } from '@ckeditor/ckeditor5-editor-classic'
import { Autoformat } from '@ckeditor/ckeditor5-autoformat'
import { GeneralHtmlSupport, HtmlComment } from '@ckeditor/ckeditor5-html-support'
import { Undo } from '@ckeditor/ckeditor5-undo'
import { SourceEditing } from '@ckeditor/ckeditor5-source-editing'

import '@ckeditor/ckeditor5-build-classic/build/translations/zh-cn'

class Editor extends ClassicEditor {
	static builtinPlugins = [
		GeneralHtmlSupport,
		HtmlComment,
		Undo,
        SourceEditing,
        Autoformat
	]

	static defaultConfig = {
		htmlSupport: {
            allow: [{
                name: /.*/,
                attributes: true,
                classes: true,
                styles: true
            }],
            disallow: [ /* HTML features to disallow */]
        },
		toolbar: {
			items: [
				'sourceEditing',
				'undo',
				'redo'
			]
		},
		language: 'zh-cn'
	}
}

export default Editor;

xxx.vue

import ClassicEditor from 'xxx/editor.js'

<Ckeditor v-model="code" :editor="ClassicEditor" />
593 次点击
所在节点    程序员
3 条回复
webbillion
28 天前
webbillion
28 天前
@webbillion #1 看错了,你有个 defaultConfig ,不过也可以试试创建的时候再添加配置呢
weiqipeng
26 天前
@webbillion 这个方式我也尝试过 创建的时候添加配置和这个 js 文件做的事情是等价的

这是一个专为移动设备优化的页面(即为了让你能够在 Google 搜索结果里秒开这个页面),如果你希望参与 V2EX 社区的讨论,你可以继续到 V2EX 上打开本讨论主题的完整版本。

https://www.v2ex.com/t/1045109

V2EX 是创意工作者们的社区,是一个分享自己正在做的有趣事物、交流想法,可以遇见新朋友甚至新机会的地方。

V2EX is a community of developers, designers and creative people.

© 2021 V2EX