运行React应用时出现loader相关编译错误（did-jwt模块解析失败）

你遇到的编译错误是因为你使用的react-scripts@4.0.3内置的babel版本不支持ES2020新增的空值合并运算符（??），而你依赖的did-jwt包的较新版本代码中使用了该语法，导致转译失败。

方案1：锁定did-jwt兼容版本（操作最简单，不改动现有配置） #

直接安装兼容旧babel版本的did-jwt版本，执行以下命令即可：

npm install did-jwt@5.12.0

如果安装后仍有冲突，可以在package.json中添加版本锁定配置：
npm 6.x版本下，先在package.json中新增resolutions字段：

"resolutions": {
  "did-jwt": "5.12.0"
}

然后执行npx npm-force-resolutions后重新安装依赖即可。

方案2：升级react-scripts到5.x版本 #

react-scripts 5.x版本已经内置支持ES2020全部语法，可以直接兼容新的运算符，执行命令：

npm install react-scripts@latest

升级完成后删除node_modules和package-lock.json，重新执行npm install即可。

方案3：修改babel配置（不推荐，需要eject） #

如果你需要保留当前react-scripts版本且不想锁定依赖版本，可以执行npm run eject暴露配置后，安装babel插件：

npm install @babel/plugin-proposal-nullish-coalescing-operator --save-dev

然后在babel配置的plugins数组中添加该插件即可。

你的App.js代码中存在拼写错误：window.etheruem应为window.ethereum，修正后才能正常调用钱包授权接口。

内容的提问来源于stack exchange，提问作者scoot556