ipfs-http-client is not compatible with vite #4091

xxxxj-up · 2022-05-03T14:39:05Z

ipfs-http-client is not compatible with vite
Vite is a front-end development and construction tool
It's so fast
but ipfs-http-client requires esbuild
so ipfs-http-client is not compatible with vite
I hop you can finish the compatible with vite

welcome · 2022-05-03T14:39:07Z

Thank you for submitting your first issue to this repository! A maintainer will be here shortly to triage and review.
In the meantime, please double-check that you have provided all the necessary information to make this process easy! Any information that can help save additional round trips is useful! We currently aim to give initial feedback within two business days. If this does not happen, feel free to leave a comment.
Please keep an eye on how this issue will be labeled, as labels give an overview of priorities, assignments and additional actions requested by the maintainers:

"Priority" labels will show how urgent this is for the team.
"Status" labels will show if this is ready to be worked on, blocked, or in progress.
"Need" labels will indicate if additional input or analysis is required.

Finally, remember to use https://discuss.ipfs.io if you just need general support.

achingbrain · 2022-05-30T17:44:37Z

Could you give a bit more context please, how does ipfs-http-client require esbuild?

A small GitHub repo that demonstrates the problem you are seeing would be very helpful.

owklama · 2022-06-01T08:58:35Z

Hey,
I have a Web3 project that includes multiple pages and I use Vite and React.js.
One of the project sections is an NFT Marketplace that requires ipfs-http-client usage,
For some reason, each time I try to create a connection I get a different type error.
I'm not too experienced with webpack configuration and stuff but I've seen couple of threads of Vite having a hard time with ipfs-http-client

Let me know if any other logs would be helpful !

Component

import { create } from "ipfs-http-client";

const NewAsset = () => {
  // connect using a URL
  const client = create("http://127.0.0.1:5002");
}

TypeError

Uncaught TypeError: require_get3(...) is not a function
    at module2.exports (index.js:7:8)
    at create2 (index.js:31:10)
    at NewAsset (NewAsset.jsx:19:18)
    at renderWithHooks (react-dom.development.js:14985:18)
    at mountIndeterminateComponent (react-dom.development.js:17811:13)
    at beginWork (react-dom.development.js:19049:16)
    at HTMLUnknownElement.callCallback2 (react-dom.development.js:3945:14)
    at Object.invokeGuardedCallbackDev (react-dom.development.js:3994:16)
    at invokeGuardedCallback (react-dom.development.js:4056:31)
    at beginWork$1 (react-dom.development.js:23964:7)

package.json

{
  "name": "krypt",
  "version": "0.0.0",
  "scripts": {
    "dev": "vite",
    "build": "vite build",
    "preview": "vite preview"
  },
  "dependencies": {
    "@honkhonk/vite-plugin-svgr": "^1.1.0",
    "@metamask/detect-provider": "^1.2.0",
    "@nomiclabs/hardhat-ethers": "^2.0.6",
    "@nomiclabs/hardhat-waffle": "^2.0.3",
    "@openzeppelin/contracts": "^4.6.0",
    "@reduxjs/toolkit": "^1.7.1",
    "axios": "^0.25.0",
    "chai": "^4.3.6",
    "dotenv": "^14.3.2",
    "ethereum-waffle": "^3.4.4",
    "ethers": "^5.6.8",
    "formik": "^2.2.9",
    "hardhat": "^2.9.7",
    "ipfs-http-client": "^50.1.2",
    "react": "^17.0.2",
    "react-dom": "^17.0.2",
    "react-icons": "^4.3.1",
    "react-redux": "^7.2.6",
    "react-reveal": "^1.2.2",
    "react-router-dom": "^6.2.1",
    "redux": "^4.1.2",
    "yup": "^0.32.11"
  },
  "devDependencies": {
    "@vitejs/plugin-react": "^1.0.7",
    "autoprefixer": "^10.4.2",
    "postcss": "^8.4.5",
    "tailwindcss": "^3.0.15",
    "vite": "^2.7.2",
    "web3modal": "^1.9.7"
  }
}

vite.config.js

import { defineConfig } from "vite";
import react from "@vitejs/plugin-react";
import svgr from "@honkhonk/vite-plugin-svgr";

// https://vitejs.dev/config/
export default defineConfig({
  plugins: [svgr(), react()],
});

xxxxj-up · 2022-06-04T14:08:52Z

Hey, I have a Web3 project that includes multiple pages and I use Vite and React.js. One of the project sections is an NFT Marketplace that requires ipfs-http-client usage, For some reason, each time I try to create a connection I get a different type error. I'm not too experienced with webpack configuration and stuff but I've seen couple of threads of Vite having a hard time with ipfs-http-client

Let me know if any other logs would be helpful !

Component

import { create } from "ipfs-http-client";

const NewAsset = () => {
  // connect using a URL
  const client = create("http://127.0.0.1:5002");
}

TypeError

Uncaught TypeError: require_get3(...) is not a function
    at module2.exports (index.js:7:8)
    at create2 (index.js:31:10)
    at NewAsset (NewAsset.jsx:19:18)
    at renderWithHooks (react-dom.development.js:14985:18)
    at mountIndeterminateComponent (react-dom.development.js:17811:13)
    at beginWork (react-dom.development.js:19049:16)
    at HTMLUnknownElement.callCallback2 (react-dom.development.js:3945:14)
    at Object.invokeGuardedCallbackDev (react-dom.development.js:3994:16)
    at invokeGuardedCallback (react-dom.development.js:4056:31)
    at beginWork$1 (react-dom.development.js:23964:7)

package.json

{
  "name": "krypt",
  "version": "0.0.0",
  "scripts": {
    "dev": "vite",
    "build": "vite build",
    "preview": "vite preview"
  },
  "dependencies": {
    "@honkhonk/vite-plugin-svgr": "^1.1.0",
    "@metamask/detect-provider": "^1.2.0",
    "@nomiclabs/hardhat-ethers": "^2.0.6",
    "@nomiclabs/hardhat-waffle": "^2.0.3",
    "@openzeppelin/contracts": "^4.6.0",
    "@reduxjs/toolkit": "^1.7.1",
    "axios": "^0.25.0",
    "chai": "^4.3.6",
    "dotenv": "^14.3.2",
    "ethereum-waffle": "^3.4.4",
    "ethers": "^5.6.8",
    "formik": "^2.2.9",
    "hardhat": "^2.9.7",
    "ipfs-http-client": "^50.1.2",
    "react": "^17.0.2",
    "react-dom": "^17.0.2",
    "react-icons": "^4.3.1",
    "react-redux": "^7.2.6",
    "react-reveal": "^1.2.2",
    "react-router-dom": "^6.2.1",
    "redux": "^4.1.2",
    "yup": "^0.32.11"
  },
  "devDependencies": {
    "@vitejs/plugin-react": "^1.0.7",
    "autoprefixer": "^10.4.2",
    "postcss": "^8.4.5",
    "tailwindcss": "^3.0.15",
    "vite": "^2.7.2",
    "web3modal": "^1.9.7"
  }
}

vite.config.js

import { defineConfig } from "vite";
import react from "@vitejs/plugin-react";
import svgr from "@honkhonk/vite-plugin-svgr";

// https://vitejs.dev/config/
export default defineConfig({
  plugins: [svgr(), react()],
});

hey
After a long time of research, this is not a simple bug. As far as I know, this bug appeared as early as 2019, and the cause of the bug involves the whole code construction, which is currently impossible to solve. But I compiled a simple file that can be used temporarily. I don't know if you need it

dlt98 · 2022-06-06T11:32:12Z

What could I do to get it working on my end? I tried disabling the error inside vite but it now just crashed whenever I try and use it.

BigLep · 2022-06-10T14:14:05Z

@xxxxj-up : it's hard to debug with your stack trace, but it looks like your client constructor needs to fixed. See #4072 which was recently updated in the docs.

xxxxj-up · 2022-06-12T00:47:20Z

What could I do to get it working on my end? I tried disabling the error inside vite but it now just crashed whenever I try and use it.

I'm so sorry. There is currently no way to fix such bugs. The only way to continue to use is to run after compilation, but the compilation results are not satisfactory and may lead to compilation errors

xxxxj-up · 2022-06-12T00:51:51Z

@xxxxj-up : it's hard to debug with your stack attack, but it looks like your client constructor needs to fixed. See #4072 which was recently updated in the docs.

#3452 #1927 #4011
Hope to help you

achingbrain · 2022-06-20T12:45:12Z

This appears to be a bug in how vite handles transitive deps with exports maps. I've opened an issue on the vite repo with a minimal repro case here.

achingbrain · 2022-06-22T09:02:42Z

The exports map issue is fixed in the latest vite beta. Unfortunately there are new regressions in that version.

github-actions · 2022-06-29T00:22:57Z

Oops, seems like we needed more information for this issue, please comment with more details or this issue will be closed in 7 days.

github-actions · 2022-07-06T00:28:29Z

This issue was closed because it is missing author input.

xxxxj-up added the need/triage Needs initial labeling and prioritization label May 3, 2022

BigLep added need/author-input Needs input from the original author and removed need/triage Needs initial labeling and prioritization labels Jun 10, 2022

github-actions bot added the kind/stale label Jun 29, 2022

github-actions bot closed this as completed Jul 6, 2022

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

ipfs-http-client is not compatible with vite #4091

ipfs-http-client is not compatible with vite #4091

xxxxj-up commented May 3, 2022

welcome bot commented May 3, 2022

achingbrain commented May 30, 2022

owklama commented Jun 1, 2022 •

edited

Loading

xxxxj-up commented Jun 4, 2022

dlt98 commented Jun 6, 2022

BigLep commented Jun 10, 2022 •

edited

Loading

xxxxj-up commented Jun 12, 2022

xxxxj-up commented Jun 12, 2022 •

edited by achingbrain

Loading

achingbrain commented Jun 20, 2022

achingbrain commented Jun 22, 2022

github-actions bot commented Jun 29, 2022

github-actions bot commented Jul 6, 2022

ipfs-http-client is not compatible with vite #4091

ipfs-http-client is not compatible with vite #4091

Comments

xxxxj-up commented May 3, 2022

welcome bot commented May 3, 2022

achingbrain commented May 30, 2022

owklama commented Jun 1, 2022 • edited Loading

xxxxj-up commented Jun 4, 2022

dlt98 commented Jun 6, 2022

BigLep commented Jun 10, 2022 • edited Loading

xxxxj-up commented Jun 12, 2022

xxxxj-up commented Jun 12, 2022 • edited by achingbrain Loading

achingbrain commented Jun 20, 2022

achingbrain commented Jun 22, 2022

github-actions bot commented Jun 29, 2022

github-actions bot commented Jul 6, 2022

owklama commented Jun 1, 2022 •

edited

Loading

BigLep commented Jun 10, 2022 •

edited

Loading

xxxxj-up commented Jun 12, 2022 •

edited by achingbrain

Loading