为何webpack编译代码存在Coinbase钱包、以太坊引用及相关报错

API 探路者

2026-8-27

问题根因

控制台抛出的Uncaught TypeError: Cannot assign to read only property 'ethereum' of object '#'里的#就是压缩混淆后的window对象。这个报错本质是requestProvider.js属于Coinbase Wallet SDK（旧名WalletLink）的内置模块，它的初始化逻辑会尝试执行window.ethereum = xxx的赋值操作，但当前运行环境里window.ethereum已经被其他钱包（比如MetaMask、浏览器内置钱包）提前通过Object.defineProperty注册为writable: false的只读属性，强行赋值就会触发类型错误。

你在node_modules里搜不到对应引用，通常是三个原因：

依赖是通过动态import或者webpack的ProvidePlugin全局注入的，静态文本检索扫不到
你用的某个Web3相关依赖（比如wagmi、web3-react、thirdweb sdk）把Coinbase Wallet的逻辑作为可选依赖按需打包，没有单独显式列在package.json的依赖列表里
上游依赖已经把requestProvider的代码内联进自身的打包产物中，不存在单独的requestProvider.js文件，所以文件名检索命中不了

定位具体引入来源

不用硬搜node_modules源码，两个方法可以快速定位：

方法1：在浏览器开发者工具的Sources面板，直接打开报错对应的requestProvider.js文件，在文件第一行打个断点，刷新页面触发断点后，看右侧Call Stack调用栈，从上往下翻就能找到是哪个业务代码/依赖文件触发了这个模块的加载
方法2：生成webpack构建依赖图谱定位：

# 生成构建依赖元文件
npx webpack --profile --json > stats.json
# 本地启动分析服务查看依赖关系
npx webpack-bundle-analyzer stats.json

在打开的依赖图谱页面直接搜requestProvider或者coinbase关键词，就能看到它是被哪个上游依赖打进来的。

解决方案

根据项目实际需求选对应方案：

场景1：项目需要接入Coinbase钱包功能
优先把Coinbase Wallet SDK升级到最新版本，新版本已经加了只读属性判断，不会强行赋值window.ethereum。如果是通过第三方Web3连接器（比如@web3-react/coinbase-wallet、wagmi的coinbase连接器）接入，把对应连接器升级到兼容最新Coinbase SDK的版本即可。
如果暂时没法升级依赖，可以在项目入口文件最顶部加一段垫片逻辑，提前把window.ethereum重置为可写：
```
if (window.ethereum) {
  const originProvider = window.ethereum
  Object.defineProperty(window, 'ethereum', {
    writable: true,
    configurable: true,
    value: originProvider
  })
}
```
场景2：项目不需要Coinbase钱包功能
直接在webpack配置里加别名，把对应模块替换为空模块，打包时就不会引入相关逻辑：
```
// webpack.config.js
module.exports = {
  // 其余原有配置不变
  resolve: {
    alias: {
      './requestProvider': false,
      'walletlink/dist/requestProvider': false
    }
  }
}
```
如果用的是umi、next.js、create-react-app等封装了webpack的框架，在框架提供的webpack配置覆写项里加上面的别名规则即可。
场景3：项目没有主动引入任何Web3相关依赖
先检查public目录下的html模板，看是否被恶意注入了Coinbase相关的第三方脚本；如果模板没有问题，逐一排查近期安装的npm包，存在恶意包偷偷植入钱包盗币逻辑的可能，直接卸载对应问题依赖即可。

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