Agenda
現象
React x Viteのまっさらな状態でmetaplex.makeを実行すると以下、2点のエラーが発生。
react Uncaught ReferenceError: global is not defined
Uncaught TypeError: Cannot read properties of undefined (reading ‘prototype’)
App.tsx(対象箇所のみ抜粋)
const getMyNfts = async () => {
const connection = new Connection(clusterApiUrl('devnet'));
const metaplex = Metaplex.make(connection)
.use(guestIdentity())
.use(bundlrStorage());
const owenerPublicKey = new PublicKey('55AfqEL3TC9mpkDZ63UCgDrzPcMQd5aZtDegfQCWQ5tK'); // Devnet
const myNfts = await metaplex
.nfts()
.findAllByOwner({ owner: owenerPublicKey });
console.log('myNfts =>', myNfts);
}
原因
Metaplexの実行に必要なモジュールや設定が足りていないため。
対応
Metaplex公式の Getting Started with Metaplex and Vite を参考にモジュールのインストールと設定を行う。
備考
MetaplexをNode上だけで扱う場合(例:Expressやts-nodeで実行するなど)は、特に必要ないので、いつも忘れがちになってしまう。
Reactなどのフロントエンドに実装する場合は、 Metaplex公式サイト を見て、不足モジュールと追加設定が必要になるため、要注意。