nftStorageUploader on Next.js App throws polyfill error

[berkaycirak]

Hi, I want to make a section on my dapp to mint an nft. To do that, I need to upload images to ipfs but that code throws me error on frontend. Does anyone have that issue before?

import { mplCore } from "@metaplex-foundation/mpl-core";
import { GenericFile } from "@metaplex-foundation/umi";
import { createUmi } from "@metaplex-foundation/umi-bundle-defaults";
import { nftStorageUploader } from "@metaplex-foundation/umi-uploader-nft-storage";
import { clusterApiUrl } from "@solana/web3.js";

const MintNFTSection = () => {
  const umi = createUmi(clusterApiUrl("devnet")).use(mplCore());
  umi.use(
    nftStorageUploader({
      token: "60b43e86.cec3fd1101fe4cb38d32e4048c72eb41",
    }),
  );

  const mintNFT = async (imageFile: GenericFile) => {
    const [imageUri] = await umi.uploader.upload([imageFile]);
  };
  return <div>MintNFTSection</div>;
};

export default MintNFTSection;

ERROR

[bdeak4]

we have same issue here, did you manage to resolve this?

[berkaycirak]

I have solved it without using nftStorageUploader :), I have uploaded it using default uploader of umi

import { createBundlrUploader } from '@metaplex-foundation/umi-uploader-bundlr';

const uploader = createBundlrUploader(umi);
const jsonURI = await uploader.uploadJson(metadata);

[nandorcsupor]

Still an issue - with
"@metaplex-foundation/umi-uploader-nft-storage": "0.9.2",

33.09 ./node_modules/@web-std/fetch/src/index.js
33.09 Attempted import error: 'web-streams-polyfill' does not contain a default export (imported as 'WebStreams').
33.09
33.09 Import trace for requested module:
33.09 ./node_modules/@web-std/fetch/src/index.js
33.09 ./node_modules/@nftstorage/metaplex-auth/dist/src/platform.js
33.09 ./node_modules/@nftstorage/metaplex-auth/dist/src/index.js
33.09 ./node_modules/@metaplex-foundation/umi-uploader-nft-storage/dist/esm/createNftStorageUploader.mjs
33.09 ./node_modules/@metaplex-foundation/umi-uploader-nft-storage/dist/esm/index.mjs
33.09 ./src/lib/umi-init.ts
33.09 ./src/hooks/useUmi.tsx
33.09
33.09
33.09 > Build failed because of webpack errors
33.11 error Command failed with exit code 1.
33.11 info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command.