Using Fs to fetch idl error: "Module not found: Can't resolve 'fs'"

Question

I keep getting this error when trying to import fs to get my idl: Module not found: Can't resolve 'fs'

Code:

const { readFileSync } = require("fs"); 

export class BigBazaar {
  constructor(
    readonly connection: Connection,
    readonly anchorWallet: AnchorWallet,
    readonly userKeypair = (anchorWallet as NodeWallet).payer,
    readonly userPubKey: PublicKey | null = anchorWallet.publicKey,
    readonly provider = setProvider(
      new AnchorProvider(connection, anchorWallet, {})
    ),
    readonly idl: Idl = JSON.parse(
      readFileSync("../idl/BigBazaar_IDL_Devnet.json", "utf-8")
    ),
    readonly programId: string = idl.metadata.address,
    readonly program = new Program(idl, programId)
  ) {}

Answer 1

The fs module doesn't exist in the browser, it's a built-in node module for reading from the file system.

Instead, try to import the file.

import idl from "../idl/BigBazaar_IDL_Devnet.json";

export class BigBazaar {
  constructor(
    readonly connection: Connection,
    readonly anchorWallet: AnchorWallet,
    readonly userKeypair = (anchorWallet as NodeWallet).payer,
    readonly userPubKey: PublicKey | null = anchorWallet.publicKey,
    readonly provider = setProvider(
      new AnchorProvider(connection, anchorWallet, {})
    ),
    readonly idl: Idl = idl,