You need to enable JavaScript to run this app.
优惠活动
大模型
产品
解决方案
定价
更多

@uiw/react-codemirror深色主题下JSON语法高亮样式与官网示例不符的问题求助

@uiw/react-codemirror深色主题下JSON语法高亮样式与官网示例不符的问题求助

我想实现和 https://uiwjs.github.io/react-codemirror/ 上一样的深色主题(theme: dark)JSON语法高亮样式,官网的效果是这样的:

官网JSON深色主题样式示例

但我使用版本为 "@uiw/react-codemirror": "^4.23.8" 的组件时,写了如下代码:

<CodeMirror
    value={{ JSON .... }}
    minHeight={"120px"}
    theme={basicDark}
    extensions={[
        basicDark,
        javascript({ jsx: true }),
        // EditorView.lineWrapping
    ]}
    onChange={onChange}
/>

得到的效果却是这样的:

本地实现的JSON深色主题样式

我发现官网示例里,JSON内容比如 "message": "Network Error" 中的键和值分别有独立的CSS类:

官网JSON元素的CSS类区分(1)
官网JSON元素的CSS类区分(2)

但在我的本地环境中,JSON的键和值用的是同一个CSS类:

本地JSON元素的CSS类情况(1)
本地JSON元素的CSS类情况(2)

看起来我本地的react-codemirror缺失了很多样式类,这是为什么呢?有没有人知道问题出在哪?为什么我的效果和官网示例不一样?

备注:内容来源于stack exchange,提问作者yeln

相关产品推荐
方舟 Agent Plan

超全模态模型 × Harness 升级,最新支持 Deepseek-V4.1-Flash、GLM-5.3 系列、Doubao-Seedream-5.0-pro、Kimi-K3 (部分), 限时 9.9 元起

最近更新时间:2026.04.14 11:44:49