react使用braft-editor报错

最新推荐文章于 2023-12-07 10:09:02 发布
最新推荐文章于 2023-12-07 10:09:02 发布
阅读量1.9k 收藏
点赞数
CC 4.0 BY-SA版权
分类专栏： webpack 基础
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.youkuaiyun.com/weixin_41829196/article/details/88774859
本文介绍了解决在Draft Convert项目中遇到的'react-dom/server'无法解析的问题。主要原因是Webpack配置不当，文中提供了具体的排查步骤及修复方法。

Can't resolve 'react-dom/server' ./node_modules/draft-convert/lib/util/getElementHTML.js

错误排查：

1.看下node_modules/react-dom/下面有没有server.js，若有的话，你得看看是不是webpack什么地方有问题导致没有正确地import这个模块

2.发现webpack配置错误

把红框的内容删除即可，亲测成功。 

React 中使用 braft-editor 踩坑记，引用 braft-utils 有错误
超逸の学习技术博客
10-15 2998
最近接到一个需求，需要支持在文本输入框支持图片粘贴上传，但是在我们这边管理页面，对于用户提的一些问题显示又不支持 Matkdown。 所以选择 braft-editor 来实现，发现提供一些配置项，因为我这边不需要那些加粗，下划线等等按钮，只需要上传图片，粘贴然后配合 COS 存链接就好了。 遇到的问题 首先我这个是 React 项目，其它项目不太清楚，然后使用 yarn。 在 utils 官方仓库中，有相关 issues，链接在下方： 引用 braft-utils 有错误 #500 其中也有人提及了一些解
使用braft-editor踩坑记录
weixin_44952328的博客
11-29 3558
后续需求有变动，需要添加额外的上传按钮，可以上传图片和office文档， 发现之前简单的复制粘贴图片的方式满足不了新的需求。之后发现braft-editor官网中提到可以结合antd组件来做一系列的操作，所以毋庸置疑的选择了和Upload结合使用方式。allowPasteImage: true, // 是否允许直接粘贴剪贴板图片到编辑器。判断文件是图片还是其他格式，图片就转成IMAGE，其他文件，转成LINK。上传图片开始使用的media属性，能直接粘贴截图，很方便。(可上传图片、文档格式)
React is not defined解决
Suk__的博客
04-09 6543
【代码】React is not defined解决。
react17安装braft-editor依赖冲突问题
qq_33159000的博客
05-23 1470
项目中react 版本是17.0.2，在安装富文本编辑器braft-editor的时候报错依赖冲突，解决方式在安装依赖的时候后边加 --force npm install braft-editor --save --force
braft-editor服务端渲染下报错document is not defined
jjh0901的博客
02-21 1292
问题描述 采用umiJS的ssr服务端渲染，集成braft-editor后，启动server报错，如下图 解决过程 1、重启node、编辑器、电脑均不起作用 2、直接查询报错相关的资料，并未找到相应的答案 3、仔细想想编辑器已经在很多项目中用了，只是简单的初始化不应该报错，想到本项目是服务端渲染，node不支持document等浏览器属性。 4、开始查阅如何解决服务端渲染使用document第三...
react-monaco-editor摩纳哥的React编辑器-源码,案例可以借鉴
03-27
通过`index.js`，我们可以看到如何在React组件中引入和使用React-Monaco-Editor，以及如何配置编辑器的选项，如语言设置、初始代码内容、事件监听等。这对于初学者来说是一份非常实用的教程。 4. **使用步骤** ...
uiw-react-md-editor-master_React_源码
10-04
本文将深入探讨如何利用React.js和TypeScript构建一个轻量级且具备预览功能的Markdown编辑器——uiw-react-md-editor。我们将从项目结构、核心概念、关键代码以及实际应用等方面进行详细讲解。 首先，Markdown是一...
react-json-editor：用于使用JSON-Schema进行响应的动态表单组件
02-03
react-json-editor使用一个JavaScript对象来描述我们希望用户提供的数据的形状-模式-并根据该模式自动创建表单。 它还使用相同的模式验证用户输入。 欢迎捐款 我很高兴接受PR。 如果您想提供帮助但不知道如何操作，...
react-md-editor：一个简单的带有预览的markdown编辑器，使用React.js和TypeScript实现
02-04
一个简单的带有预览的markdown编辑器，使用React.js和TypeScript实现。 这个React组件旨在为一个简单的Markdown编辑器提供语法高亮显示支持。 这是基于textarea封装的，因此...npm i @uiw/react-md-editor 使用 impor
解决braft-editor 在 nextjs 中 window is not defined and createEditorState is not a function的问题
打码键盘侠
02-06 2598
在使用同构框架nextjs中使用富文本braft-editor中不能正常编译的问题，直接用 import from 在nodejs中无法识别window浏览器对象，在nodejs中只能识别 module； 还好，nextjs提供了高级dynamic特性，可以不用ssr的方式编译，用法如下： const BraftEditor = dynamic(() => import('braft-editor'), { ssr: false }) 单是还会存在一个问题，BarftEditor 不是..
在react18中安装@toast-ui/react-editor依赖报错
fyw1789的博客
12-07 765
按照报错信息@toast-ui/react-editor还是react17的版本的所以导致不能安装。这样就能强制安装然后再使用就行了。
npm ERR! While resolving: braft-editor@2.3.9
subsistent的博客
12-11 621
错误：npm ERR! While resolving: braft-editor@2.3.9
【antd】braft-editor，出现样式没有加载问题
rtxiaoying的博客
03-23 560
项目中集成braft-editor，出现下面的问题 但是比较了代码发现没有什么问题，怀疑是浏览器的兼容性问题，在最新的chrome中运行也是一样的， 分析是样式没有加载，去github的braft-editor的issue中也没有找到解决办法 看到官网中的集成代码第一句好像我没写，果断些写上，立刻好使了。 import 'braft-editor/dist/index.css' ...
braft-editor富文本编辑器（React-hooks）
大素儿的博客
06-08 2426
基本写法---富文本组件 import React, { ReactElement, useEffect, useState } from 'react' import { PictureOutlined } from '@ant-design/icons/lib' import { ContentUtils } from 'braft-utils' import BraftEditor from 'braft-editor' import { Button, Upload } from 'antd..
umi或antdpro运行时报错“Module ‘xxx‘ does not exist in container“解决方案
热门推荐
GMLGDJ的博客
03-10 1万+
问题描述 在我们启动基于umi的脚手架,如antd pro,在运行完毕后控制台报如下错误： Error: Module "本地的路径信息" does not exist in container. 原因:可能是因为项目路径移动后导致src/.umi缓存文件找不到原来的路径所导致的 问题解决 方案一： 删除src/.umi然后重新运行项目就解决了 方案二： 关闭mfsu功能，在config/config.ts中找到mfsu并删除该属性。 ...
antdesign前端一直加载不出来
Go_ahead_forever的博客
12-06 1026
报错：Module “./querystring” does not exist in container.antdesign前端一直加载不出来。
reactHooks+TS：富文本braft-editor常见用法
君莫笑
01-06 6212
关于reactHooks+TS中富文本插件btaft-editor的使用。
“Module ‘xxx‘ does not exist in container“
weixin_44134588的博客
08-04 1万+
今天写项目的时候 ,是使用的umi 框架,并且使用 mfsu 开启了热更新(会使项目更改之后的重新加载速度提高一大截) 今天的需求是使用maplibre在页面上创建一个地图,逻辑都写好了,但是就是安装依赖项 'maplibre-gl’之后,依赖引入老是失败; 找了一万年的原因Loading… 还是没找到0.0 最后在社区一直逛一直逛… 找到一个类似的问题,然后转念一想自己的项目也开启了mfsu, 然后就尝试了一下删掉src下的.umi文件夹,相当于清除了缓存,然后项目就跑通了, 点赞! 膜拜大佬! ..
npm ERR! code ERESOLVE npm ERR! ERESOLVE unable to resolve dependency tree
~~~
03-28 5016
使用 npm@6 不需要卸载 npm@7，可以使用 npx 去指定 npm 的版本。即可以这么使用：npx -p npm@6 npm install --legacy-peer-deps。根据它的建议，我们去执行npm install --force 或者 npm install --legacy-peer-deps，一般就可以重新启动，如果不行的话，检查npm版本。英语翻译一下就是：不能解析依赖树 ，需要先修复上面依赖关系冲突或者重新执行一下npm install命令。
braft-editor react 版本冲突
最新发布
01-25
### 解决 Braft-Editor 和 React 版本冲突的方法 当在 React 项目中集成 `braft-editor` 遇到版本冲突时，通常是因为所使用的 `braft-editor` 或其依赖项与当前项目的 React 版本不匹配。为了解决这个问题，可以采取以下几种方法： #### 方法一：调整包版本 确保所有依赖项都兼容于同一个 React 版本。可以通过指定特定版本来安装这些库。 ```bash npm install braft-editor@compatible_version react@specific_version react-dom@specific_version ``` 其中 `compatible_version` 是指与目标 React 版本相适应的 `braft-editor` 的版本号[^1]。 #### 方法二：使用 Yarn Resolutions 如果正在使用 Yarn，则可通过配置 `resolutions` 来强制解析整个依赖树中的某个包的具体版本。 编辑 `package.json` 文件，在最外层添加如下字段: ```json { "resolutions": { "react": "^16.8.0", "react-dom": "^16.8.0" } } ``` 之后重新构建依赖关系以应用更改。 #### 方法三：升级或降级 React 应用程序 有时可能需要考虑更新 Create React App 到最新稳定版本或者回退至更早的一个版本，这取决于 `braft-editor` 所支持的最佳实践。对于某些情况来说，保持一致性的最佳方式可能是锁定在一个已知良好的组合上，比如通过全局安装指定版本的 Create React App 工具链: ```bash sudo npm install --global create-react-app@3.0.1 ``` 这种方法有助于避免因工具链内部变化而引起的潜在问题。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值