自定义Socket.io时遇events模块解析错误，该如何修复？

你遇到的错误是因为浏览器的ES模块系统不支持直接引用Node.js的核心模块，events是Node.js内置的模块，浏览器环境里没有这个模块，所以浏览器无法解析import EventEmitter from 'events'这种非相对路径的导入。

下面给你两种可行的修复方案：

方案一：用浏览器原生API实现事件发射器（纯前端，无需Node.js依赖） #

现代浏览器原生支持EventTarget API，可以用它来模拟EventEmitter的功能，完全不需要依赖Node.js模块。修改你的collector.js代码如下：

// 基于浏览器原生EventTarget封装类似EventEmitter的类
class EventEmitter extends EventTarget {
  // 监听事件
  on(eventName, callback) {
    this.addEventListener(eventName, callback);
  }

  // 移除事件监听
  off(eventName, callback) {
    this.removeEventListener(eventName, callback);
  }

  // 触发事件，支持传递数据
  emit(eventName, data) {
    this.dispatchEvent(new CustomEvent(eventName, { detail: data }));
  }
}

const eventEmitter = new EventEmitter();
export default eventEmitter;

// 测试监听
eventEmitter.on('hi', () => {
  console.log('hi, Leahim');
});

修改后直接在浏览器里打开index.html就能正常运行，所有事件相关逻辑都基于浏览器原生API实现，没有外部依赖。

方案二：用打包工具兼容Node.js模块（需要Node.js环境） #

如果你坚持要使用Node.js的EventEmitter，需要用打包工具（比如Vite、Webpack）将Node.js模块转换为浏览器能识别的代码：

1. 初始化Node.js项目：

npm init -y

2. 安装打包工具（以Vite为例）：

npm install vite --save-dev

3. 把你的collector.js和index.html放在项目根目录，然后启动开发服务：

npx vite

Vite会自动处理Node.js核心模块的兼容性，将events模块打包成浏览器可运行的代码，此时访问Vite提供的本地服务（默认是http://localhost:5173）就能正常运行你的代码。

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