如何修复错误：Web3.providers.HttpProvider 不是构造函数

问题原因 #

Web3.js v4.x及以上版本重构了模块架构，将HttpProvider从Web3.providers中移除，改为独立包导出，这是旧代码报错的核心原因。

解决方案 #

1. 快速修复（推荐）：直接传入RPC URL给Web3构造函数 #

Web3 v4+支持直接将RPC URL传入Web3构造函数，内部会自动创建对应的HttpProvider，无需手动实例化：

const url = `https://sepolia.infura.io/v3/{my_api_key}`;
const web3 = new Web3(url);

2. 手动创建HttpProvider（适用于自定义配置场景） #

如果需要对Provider做自定义配置（比如设置超时、请求头），需单独导入HttpProvider：

ES模块（import）写法：

import { Web3 } from 'web3';
import { HttpProvider } from 'web3-providers-http';

const url = `https://sepolia.infura.io/v3/{my_api_key}`;
// 可添加自定义配置，例如设置10秒超时
const provider = new HttpProvider(url, { timeout: 10000 });
const web3 = new Web3(provider);

CommonJS（require）写法：

const { Web3 } = require('web3');
const { HttpProvider } = require('web3-providers-http');

const url = `https://sepolia.infura.io/v3/{my_api_key}`;
const provider = new HttpProvider(url);
const web3 = new Web3(provider);

3. 回退到Web3 v1.x版本（兼容旧代码） #

如果不想修改代码，可以安装指定的v1.x版本：

# 使用npm安装
npm install web3@1.10.4
# 使用yarn安装
yarn add web3@1.10.4

安装完成后，原代码即可正常运行：

const Web3 = require('web3');
const url = `https://sepolia.infura.io/v3/{my_api_key}`;
const web3 = new Web3(new Web3.providers.HttpProvider(url));

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