尝试在 React 中使用“Socket.io-client”模块会引发错误：无法分配给对象“#<Object>”的只读属性“exports”

Posted 2023-02-18

【中文标题】尝试在 React 中使用“Socket.io-client”模块会引发错误：无法分配给对象“#<Object>”的只读属性“exports”

【英文标题】：Trying to use "Socket.io-client" module in React throws error: Cannot assign to read only property 'exports' of object '#<Object>'

【发布时间】：2021-12-04 09:10:36

【问题描述】：

我在我的 React js Web 应用程序中使用socket.io-client。它编译没有错误，但是当我尝试打开开发服务器 (localhost:3000) 时，我收到以下错误：

在 this 引发错误的项目中，以下是相关包及其版本的列表：

@testing-library/jest-dom@5.14.1 @testing-library/react@11.2.7 @testing-library/user-event@12.8.3 react-dom@17.0.2 react-scripts@4.0.3 react@17.0.2 socket.io-client@4.3.1

Webpack 版本：4.44.2

---

this one 之类的线程表明这是在 ES6 中混合 import 和 module.exports 的某种问题，但我绝对不想修改 socket.io-client 模块。

在一个以前的 React 项目中，该模块工作，下面是相关包及其版本的列表：

@testing-library/jest-dom@4.2.4 @testing-library/react@9.5.0 @testing-library/user-event@7.2.1 react-scripts@3.4.4 react@16.14.0 socket.io-client@4.1.2

Webpack 版本：4.42.0

我已经尝试过使用不同版本的 socket.io-client 并做出反应以尝试使其正常工作，但无济于事......

【问题讨论】：

现在将 socket.io-client 降级到 v4.2.0。由于 ESM 构建而引入的错误正在得到解决。最新版本最多可能需要 2-3 天才能稳定到可以使用。

解决了！谢谢

【参考方案1】：

Webpack 使用 ES 语法，因此 commonJS 语法不起作用。

export default lookup

【讨论】：

在不修改包本身的情况下有没有办法解决这个问题？因为正如我在问题中提到的那样，我之前在之前的 React 项目中也有过这个工作

你可以尝试更改 webpack 的版本