build(deps): 移除 ckeditor 和 tiptap 相关依赖

2026-09-14 09:38:24 +08:00
parent 545326bd81
commit ff67f88696
9 changed files with 144 additions and 3882 deletions
@@ -0,0 +1,99 @@
+/**
+ * Word / WPS 粘贴富文本的归一化处理。
+ *
+ * 直接插入 Word 复制出的 HTML 会出现「表格被截断」，原因有三：
+ * ① 表格与单元格带绝对宽度（pt / px），宽度总和超过容器后被整体裁切；
+ * ② 单元格带 `white-space: nowrap` 或 `nowrap` 属性，内容不换行而横向溢出；
+ * ③ Word 私有 `mso-*` 样式与 `overflow: hidden` 把超出部分直接隐藏。
+ *
+ * 本模块只解除这些「布局锁定」，表格结构（行列、合并、边框、加粗、对齐）全部保留，
+ * 宽度改由各渲染端的 CSS 统一控制，避免同一份文书在不同容器里表现不一致。
+ */
+
+const COMMENTS = /<!--[\s\S]*?-->/g
+/** 成对出现的标签整体删除（含内容） */
+const BLOCK_TAGS = /<(script|style|meta|link)\b[^>]*>[\s\S]*?<\/\1>/gi
+/** 自闭合标签：`<script />`、`<meta ...>`、`<link ...>` */
+const VOID_TAGS = /<(script|meta|link)\b[^>]*\/?>/gi
+
+/** 会造成截断的样式声明：绝对宽度、固定布局与内容裁剪 */
+const LAYOUT_LOCK_STYLES = new Set([
+  'width',
+  'min-width',
+  'max-width',
+  'height',
+  'table-layout',
+  'white-space',
+  'overflow',
+  'overflow-x',
+  'overflow-y',
+])
+
+/** 与样式等价的 HTML 属性，Word 会同时输出两者 */
+const LAYOUT_LOCK_ATTRIBUTES = ['width', 'height', 'nowrap']
+
+function sanitizeStyleAttribute(style: string): string {
+  return style
+    .split(';')
+    .map((declaration) => declaration.trim())
+    .filter(Boolean)
+    .filter((declaration) => {
+      const property = (declaration.split(':')[0] ?? '').trim().toLowerCase()
+
+      if (!property || property.startsWith('mso-')) {
+        return false
+      }
+
+      return !LAYOUT_LOCK_STYLES.has(property)
+    })
+    .join('; ')
+}
+
+/**
+ * 归一化 Word / WPS 粘贴的富文本 HTML。
+ * 入参为空或解析失败时原样返回，不会抛错。
+ */
+export function normalizePastedHtml(html: string): string {
+  if (!html) {
+    return ''
+  }
+
+  const stripped = html.replace(COMMENTS, '').replace(BLOCK_TAGS, '').replace(VOID_TAGS, '')
+
+  const parsed = new DOMParser().parseFromString(`<div id="pasted-root">${stripped}</div>`, 'text/html')
+  const root = parsed.getElementById('pasted-root')
+
+  if (!root) {
+    return stripped
+  }
+
+  // Word 私有属性（mso-*、align 之外的 xmlns 等）在其他渲染环境里没有意义，留着反而干扰布局
+  root.querySelectorAll('*').forEach((element) => {
+    Array.from(element.attributes).forEach((attribute) => {
+      if (attribute.name.toLowerCase().startsWith('mso-')) {
+        element.removeAttribute(attribute.name)
+      }
+    })
+  })
+
+  // 表格、列定义与单元格：解除绝对尺寸与不换行约束，宽度交由渲染端 CSS 决定
+  root.querySelectorAll('table, col, colgroup, td, th').forEach((element) => {
+    LAYOUT_LOCK_ATTRIBUTES.forEach((name) => element.removeAttribute(name))
+
+    const style = element.getAttribute('style')
+
+    if (!style) {
+      return
+    }
+
+    const sanitized = sanitizeStyleAttribute(style)
+
+    if (sanitized) {
+      element.setAttribute('style', sanitized)
+    } else {
+      element.removeAttribute('style')
+    }
+  })
+
+  return root.innerHTML
+}