UniApp + Vue3 使用 marked 报错：SyntaxError /[\p{L}\p{N}]/u 问题分析与解决

背景

在开发中接收SSE的markdown文本，需要使用库解决，就引入了marked库作为解析器。引入的是marked@4.3.0，在uniapp的vue2版本一切正常。当将该页面迁移到vue3版本就出现报错。

报错如下图所示：

问题分析

引入的marked，/[\p{L}\p{N}]/u语法，是需要​​运行在ES2018，Unicode 正则支持​ ,在vue3版本打包后没有对该语法进行处理，导致打包后运行在微信小程序出现报错，导致页面白屏。

解决方案

1. 更换marked库
2. 修改vite配置，语法降级
3. 修改marked库源码

由于我是直接引入源文件放入分包中，因为直接使用npm引入，会打入主包。将该语法进行替换，根据自身情况进行替换：

我将其中：!e.match(/[\p{L}\p{N}]/u) ，修改为：!/[a-zA-Z0-9\u4e00-\u9fff]/.test(e)

测试后正常展示。

总结

最后总结一下，出现/[\p{L}\p{N}]/u 报错，可直接修改报错语法，根据自身进行适配处理。