Skip to content

Commit 0977f73

Browse files
Rain1601claude
andcommitted
fix: 修复 ArticleNotionEditor 代码块显示问题
- 将 CodeBlockLowlight 替换为 CollapsibleCodeBlock - 移除 lowlight 初始化代码 - 添加可折叠代码块样式 - 修复代码块标记 ```json 被当作文本显示的问题 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com>
1 parent daf9c57 commit 0977f73

1 file changed

Lines changed: 3 additions & 13 deletions

File tree

frontend/components/ArticleNotionEditor.tsx

Lines changed: 3 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,7 @@ import React, { useState, useCallback, useEffect } from 'react';
44
import { useEditor, EditorContent } from '@tiptap/react';
55
import StarterKit from '@tiptap/starter-kit';
66
import Highlight from '@tiptap/extension-highlight';
7-
import CodeBlockLowlight from '@tiptap/extension-code-block-lowlight';
7+
import CollapsibleCodeBlock from '@/lib/tiptap-extensions/CollapsibleCodeBlock';
88
import Image from '@tiptap/extension-image';
99
import Dropcursor from '@tiptap/extension-dropcursor';
1010
import { Table } from '@tiptap/extension-table';
@@ -21,11 +21,7 @@ import Superscript from '@tiptap/extension-superscript';
2121
import Subscript from '@tiptap/extension-subscript';
2222
import { Extension } from '@tiptap/core';
2323
import { Plugin, PluginKey } from '@tiptap/pm/state';
24-
import { createLowlight } from 'lowlight';
25-
import javascript from 'highlight.js/lib/languages/javascript';
26-
import typescript from 'highlight.js/lib/languages/typescript';
27-
import css from 'highlight.js/lib/languages/css';
28-
import python from 'highlight.js/lib/languages/python';
24+
import '../styles/collapsible-code.css';
2925

3026
import { Button } from './ui/button';
3127
import { Card } from './ui/card';
@@ -40,12 +36,6 @@ import {
4036

4137
import { uploadToGitHub, getGitHubConfig } from '@/lib/github-upload';
4238

43-
const lowlight = createLowlight();
44-
lowlight.register('javascript', javascript);
45-
lowlight.register('typescript', typescript);
46-
lowlight.register('css', css);
47-
lowlight.register('python', python);
48-
4939
// 图片上传函数
5040
async function uploadImageToGitHub(file: File): Promise<string> {
5141
try {
@@ -226,7 +216,7 @@ export function ArticleNotionEditor({
226216
listItem: false,
227217
}),
228218
Highlight.configure({ multicolor: true }),
229-
CodeBlockLowlight.configure({ lowlight, defaultLanguage: 'javascript' }),
219+
CollapsibleCodeBlock,
230220
Image.configure({ inline: false, allowBase64: true }),
231221
Dropcursor.configure({ color: '#3b82f6', width: 2 }),
232222

0 commit comments

Comments
 (0)