当前位置： 文江博客话题详情

错误 - ./node_modules/web3-eth-contract/node_modules/web3-providers-http/lib/index.js:26:0 找不到模块：无法解析“http”；

发布于 2025-01-15 12:00:34 字数 4999 浏览 5 评论 0原文

我正在处理 Next.js

Error，我收到了 =>

    error - ./node_modules/web3-eth-contract/node_modules/web3-providers-http/lib/index.js:26:0
Module not found: Can't resolve 'http'

Import trace for requested module:
./node_modules/web3-eth-contract/node_modules/web3-core-requestmanager/lib/index.js
./node_modules/web3-eth-contract/node_modules/web3-core/lib/index.js
./node_modules/web3-eth-contract/lib/index.js
./node_modules/@toruslabs/fetch-node-details/dist/fetchNodeDetails.esm.js
./node_modules/@toruslabs/torus-embed/dist/torus.esm.js
./node_modules/@web3auth/torus-evm-adapter/dist/torusEvmAdapter.esm.js
./node_modules/@web3auth/web3auth/dist/web3auth.esm.js
./node_modules/moralis/lib/browser/Web3Connector/Web3AuthConnector.js
./node_modules/moralis/lib/browser/MoralisWeb3.js
./node_modules/moralis/lib/browser/Parse.js
./node_modules/moralis/index.js
./node_modules/react-moralis/lib/index.esm.js
./pages/_app.js

我的 package.json =>

        {
  "name": "client",
  "private": true,
  "browser": {
    "fs": false,
    "path": false,
    "crypto": false,
    "os": false
  },
  "scripts": {
    "dev": "next dev",
    "build": "next build",
    "start": "next start",
    "lint": "next lint"
  },
  "dependencies": {
    "@babel/runtime": "^7.17.8",
    "@nomiclabs/hardhat-ethers": "^2.0.5",
    "@nomiclabs/hardhat-waffle": "^2.0.3",
    "@openzeppelin/contracts": "^4.5.0",
    "@walletconnect/web3-provider": "^1.7.5",
    "@web3auth/web3auth": "^0.6.3",
    "assert": "^2.0.0",
    "axios": "^0.26.1",
    "chai": "^4.3.6",
    "crypto": "^1.0.1",
    "crypto-browserify": "^3.12.0",
    "dotenv": "^16.0.0",
    "elasticsearch": "^16.7.3",
    "elasticsearch-browser": "^16.7.1",
    "ethereum-waffle": "^3.4.0",
    "ethers": "^5.6.1",
    "fs": "^0.0.1-security",
    "hardhat": "^2.9.1",
    "http": "^0.0.1-security",
    "ipfs-http-client": "^56.0.1",
    "magic-sdk": "^8.1.0",
    "moralis": "^1.5.5",
    "next": "12.1.0",
    "react": "17.0.2",
    "react-dom": "17.0.2",
    "react-moralis": "^1.3.4",
    "reactjs-popup": "^2.0.5",
    "stream": "^0.0.2",
    "web3modal": "^1.9.5"
  },
  "devDependencies": {
    "autoprefixer": "^10.4.4",
    "eslint": "8.11.0",
    "eslint-config-next": "12.1.0",
    "postcss": "^8.4.12",
    "tailwind": "^4.0.0",
    "tailwindcss": "^3.0.23"
  }
}

next.config.js =>;

   module.exports = (phase, { defaultConfig }) => {
  return {
    ...defaultConfig,

    webpack: (config) => {
      config.resolve = {
        ...config.resolve,
        fallback: {
          "fs": false,
          "path": false,
          "os": false,
          "crypto": false,
        }
      }
      return config
    },
  }
}

_app.js =>;

import '../styles/globals.css'
import Link from 'next/link'
import Head from 'next/head'
import Footer from './components/Footer/Footer'
import { MoralisProvider } from "react-moralis"
import { ServerUrl, AppId } from "../config"

function MyApp({ Component, pageProps }) {
  return (
    <MoralisProvider appId={AppId} serverUrl={ServerUrl}>
      <div className='flex flex-col h-screen'>
        <Head>
          <title> Certified-Cliché</title>
          <meta name="description" content="Generated by create next app" />
          <link rel="icon" href="/favicon.ico" />
        </Head>
        <nav className="border-b p-6 place-content-center">
          <p className="text-4xl font-bold mt-4  ">
            Certified-Cliché
          </p>
          <div className="flex mt-4">
            <Link href="/home">
              <a className="mr-4 text-pink-500">
                Home
              </a>
            </Link>
            <Link href="/create-certificate">
              <a className="mr-6 text-pink-500">
                Create Certificate
              </a>
            </Link>
            <Link href="/transferred-certificate">
              <a className="mr-6 text-pink-500">
                Transferred Certificate
              </a>
            </Link>
            <Link href="/my-certificates">
              <a className="mr-6 text-pink-500">
                My Certificates
              </a>
            </Link>
          </div>
        </nav>

        <Component {...pageProps} />
        <Footer />
      </div>
    </MoralisProvider>
  )
}

导出默认 MyApp

我到目前为止尝试过的 =>

  1. 删除 node_modules 和 npm i。
  2. npm i http
  3. 删除 .next 构建文件夹并重新开始。
  4. 在 package.json 中设置浏览器 - crypto:false

我发现的大多数解决方案都是针对 Angular.js 的。

如果您需要更多信息，请告诉我。 先感谢您。

原文

I am working on Next.js

Error which I am receiving =>

    error - ./node_modules/web3-eth-contract/node_modules/web3-providers-http/lib/index.js:26:0
Module not found: Can't resolve 'http'

Import trace for requested module:
./node_modules/web3-eth-contract/node_modules/web3-core-requestmanager/lib/index.js
./node_modules/web3-eth-contract/node_modules/web3-core/lib/index.js
./node_modules/web3-eth-contract/lib/index.js
./node_modules/@toruslabs/fetch-node-details/dist/fetchNodeDetails.esm.js
./node_modules/@toruslabs/torus-embed/dist/torus.esm.js
./node_modules/@web3auth/torus-evm-adapter/dist/torusEvmAdapter.esm.js
./node_modules/@web3auth/web3auth/dist/web3auth.esm.js
./node_modules/moralis/lib/browser/Web3Connector/Web3AuthConnector.js
./node_modules/moralis/lib/browser/MoralisWeb3.js
./node_modules/moralis/lib/browser/Parse.js
./node_modules/moralis/index.js
./node_modules/react-moralis/lib/index.esm.js
./pages/_app.js

My package.json =>

        {
  "name": "client",
  "private": true,
  "browser": {
    "fs": false,
    "path": false,
    "crypto": false,
    "os": false
  },
  "scripts": {
    "dev": "next dev",
    "build": "next build",
    "start": "next start",
    "lint": "next lint"
  },
  "dependencies": {
    "@babel/runtime": "^7.17.8",
    "@nomiclabs/hardhat-ethers": "^2.0.5",
    "@nomiclabs/hardhat-waffle": "^2.0.3",
    "@openzeppelin/contracts": "^4.5.0",
    "@walletconnect/web3-provider": "^1.7.5",
    "@web3auth/web3auth": "^0.6.3",
    "assert": "^2.0.0",
    "axios": "^0.26.1",
    "chai": "^4.3.6",
    "crypto": "^1.0.1",
    "crypto-browserify": "^3.12.0",
    "dotenv": "^16.0.0",
    "elasticsearch": "^16.7.3",
    "elasticsearch-browser": "^16.7.1",
    "ethereum-waffle": "^3.4.0",
    "ethers": "^5.6.1",
    "fs": "^0.0.1-security",
    "hardhat": "^2.9.1",
    "http": "^0.0.1-security",
    "ipfs-http-client": "^56.0.1",
    "magic-sdk": "^8.1.0",
    "moralis": "^1.5.5",
    "next": "12.1.0",
    "react": "17.0.2",
    "react-dom": "17.0.2",
    "react-moralis": "^1.3.4",
    "reactjs-popup": "^2.0.5",
    "stream": "^0.0.2",
    "web3modal": "^1.9.5"
  },
  "devDependencies": {
    "autoprefixer": "^10.4.4",
    "eslint": "8.11.0",
    "eslint-config-next": "12.1.0",
    "postcss": "^8.4.12",
    "tailwind": "^4.0.0",
    "tailwindcss": "^3.0.23"
  }
}

next.config.js =>

   module.exports = (phase, { defaultConfig }) => {
  return {
    ...defaultConfig,

    webpack: (config) => {
      config.resolve = {
        ...config.resolve,
        fallback: {
          "fs": false,
          "path": false,
          "os": false,
          "crypto": false,
        }
      }
      return config
    },
  }
}

_app.js =>

import '../styles/globals.css'
import Link from 'next/link'
import Head from 'next/head'
import Footer from './components/Footer/Footer'
import { MoralisProvider } from "react-moralis"
import { ServerUrl, AppId } from "../config"

function MyApp({ Component, pageProps }) {
  return (
    <MoralisProvider appId={AppId} serverUrl={ServerUrl}>
      <div className='flex flex-col h-screen'>
        <Head>
          <title> Certified-Cliché</title>
          <meta name="description" content="Generated by create next app" />
          <link rel="icon" href="/favicon.ico" />
        </Head>
        <nav className="border-b p-6 place-content-center">
          <p className="text-4xl font-bold mt-4  ">
            Certified-Cliché
          </p>
          <div className="flex mt-4">
            <Link href="/home">
              <a className="mr-4 text-pink-500">
                Home
              </a>
            </Link>
            <Link href="/create-certificate">
              <a className="mr-6 text-pink-500">
                Create Certificate
              </a>
            </Link>
            <Link href="/transferred-certificate">
              <a className="mr-6 text-pink-500">
                Transferred Certificate
              </a>
            </Link>
            <Link href="/my-certificates">
              <a className="mr-6 text-pink-500">
                My Certificates
              </a>
            </Link>
          </div>
        </nav>

        <Component {...pageProps} />
        <Footer />
      </div>
    </MoralisProvider>
  )
}

export default MyApp

What I tried till now =>

  1. Deleting node_modules and npm i.
  2. npm i http
  3. Deleting the .next build folder and starting again.
  4. Setting the browser- crypto:false in package.json

Most the solutions I found were for the Angular.js.

If you require any more information, then please let me know.
Thank You in Advance.

如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论， 你可以免费 注册 一个本站的账号。

评论（1）

微凉徒眸意 2025-01-22 12:00:34

此错误基于 Next.js 网站：

找不到模块错误发生这种情况的原因有很多：

  • 您尝试导入的模块未安装在依赖项中
  • 您尝试导入的模块位于不同的目录中
  • 您尝试导入的模块具有不同的大小写
  • 您尝试导入的模块正在尝试导入使用 Node.js 特定模块，例如示例 dns，在 getStaticProps / getStaticPaths / getServerSideProps 之外，

请查看链接以获取可能的修复。

This error you have based on Next.js website:

A module not found error can occur for many different reasons:

  • The module you're trying to import is not installed in your dependencies
  • The module you're trying to import is in a different directory
  • The module you're trying to import has a different casing
  • The module you're trying to import uses Node.js specific modules, for example dns, outside of getStaticProps / getStaticPaths / getServerSideProps

Please check out the link for possible fixes.

回复 原文
~没有更多了~

关于作者

分开我的手

暂无简介

文章
评论
29 人气
发私信

相关话题

更多

热门标签

操作系统 程序设计 IT运维 Linux系统管理 JavaScript 服务器应用 solaris C/C++ PHP Shell BSD Vue.js aix Oracle Python HTML 系统管理 HTML5 CSS 前端
更多

推荐作者

甲如呢乙后呢

文章 0 评论 0

王权女流氓

文章 0 评论 0

云雾

文章 0 评论 0

wyh2033345759

文章 0 评论 0

乖乖

文章 0 评论 0

qq_xR3jkM

文章 0 评论 0

更多

友情链接

文江博客
    我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站，即表示您同意使用 Cookies 和您的相关数据。
    原文