Metaplex and Solana Web3.js dependency conflict (React)

Question

I am developing a React app, and I have code from two different applications I wrote:

Application A uses Metaplex to find all the NFTs owned by a user (wallet address):

import { Connection as MetaConnection } from "@metaplex/js/";
import { Metadata, MetadataData } from "@metaplex-foundation/mpl-token-metadata";

const lookupNfts = async () => {
    let metaConnection = new MetaConnection('mainnet-beta');
    const nftsmetadata = await Metadata.findDataByOwner(metaConnection, props.walletKey);

    // Now I have a list of NFTs via metadata
}

"dependencies": {
  "@metaplex-foundation/mpl-token-metadata": "^1.2.5",
  "@metaplex/js": "^4.12.0",
  "@solana/spl-token": "^0.1.8",
  "@solana/web3.js": "^1.35.3",
}

Application B does a payment between wallets of an NFT:

import { Connection, Keypair, PublicKey } from "@solana/web3.js";
import { Account } from "@solana/spl-token";   // ERROR on this line, see screenshot

async function transfer_tokens(wallet: Keypair, connection: Connection, amount: number, reciver_token_account: Account, from_token_account: Account) {
// If tx takes more when 60 seconds to complete you will receive error here
const transfer_tx = await splToken.transfer(
    connection,
    wallet,
    from_token_account.address,
    reciver_token_account.address,
    wallet,
    amount,
    [wallet],
    false,
    splToken.TOKEN_PROGRAM_ID,
)

However, when I try to use this code together in one application, it doesn’t work...

There seems to be a conflict. The dependency from application A pulls in @solana/spl-token@0.1.8, but application B requires @solana/spl-token@0.2.0.

If I upgrade solana/spl-token to 0.2.0, application A breaks. If I keep solana/spl-token at 0.1.8, application B doesn’t work.

I did a npm ls, and it shows this:

It seems the metaplex/js@4.12.0 has a dependency to 0.1.8, which is old.

How can I resolve this dependency conflict?

Please review *[Why not upload images of code/errors when asking a question?](https://meta.stackoverflow.com/questions/285551/)* (e.g., *"Images should only be used to illustrate problems that* ***can't be made clear in any other way,*** *such as to provide screenshots of a user interface."*) and [do the right thing](https://stackoverflow.com/posts/72217359/edit) (it covers command lines and program text output as well). Thanks in advance. — Peter Mortensen, Sep 10 '22 at 12:36

score 3 · Accepted Answer · edited Sep 10 '22 at 12:39

The @metaplex/js library uses old versions of MPL packages such as @metaplex-foundation/mpl-token-metadata which, as you figured out, use an old version of @solana/spl-token. Unfortunately, if even just one nested dependency uses version 0.1.8 of the SPL token program, it will be used for the entire project.

If you are using Yarn, a quick fix could be to force version 0.2.0 using the resolutions object in your package.json.

"resolutions": {
  "@solana/spl-token": "0.2.0"
}

If you're using npm, you will also need to install this package.

However, it is worth noting that the current JavaScript SDK from Metaplex is going to be deprecated in favour of the new one: https://github.com/metaplex-foundation/js-next

With the new JS SDK, you can fetch all NFTs by owner using the following piece of code.

import { Metaplex } from "@metaplex-foundation/js-next";
import { Connection, clusterApiUrl } from "@solana/web3.js";

const connection = new Connection(clusterApiUrl("mainnet-beta"));
const metaplex = new Metaplex(connection);
const owner = new PublicKey("some_public_key");

const nft = await metaplex.nfts().findAllByOwner(owner);

Metaplex and Solana Web3.js dependency conflict (React)

1 Answers1