Error Class extends value undefined is not a constructor or null

[eli6]

Hi! I am following this guide, adding the code to my create-react-app project:

https://docs.metaplex.com/programs/candy-machine/getting-started

But as soon as I include mpl-candy-machine I get the following runtime error from its depencency mpl-token-metadata:

ERROR Class extends value undefined is not a constructor or null TypeError: Class extends value undefined is not a constructor or null at ./node_modules/@metaplex-foundation/mpl-token-metadata/dist/src/errors.js (http://localhost:3000/static/js/bundle.js:8513:40) at options.factory (http://localhost:3000/static/js/bundle.js:110628:31) at __webpack_require__ (http://localhost:3000/static/js/bundle.js:110051:33) at fn (http://localhost:3000/static/js/bundle.js:110285:21) at ./node_modules/@metaplex-foundation/mpl-token-metadata/dist/src/hooked/metadataDelegateRoleSeed.js (http://localhost:3000/static/js/bundle.js:22151:18) at options.factory (http://localhost:3000/static/js/bundle.js:110628:31) at __webpack_require__ (http://localhost:3000/static/js/bundle.js:110051:33) at fn (http://localhost:3000/static/js/bundle.js:110285:21) at ./node_modules/@metaplex-foundation/mpl-token-metadata/dist/src/hooked/index.js (http://localhost:3000/static/js/bundle.js:22132:14) at options.factory (http://localhost:3000/static/js/bundle.js:110628:31)

I have checked the errors.js file of mpl-token-metadata and it is extending the UmiError class that is indeed being exported from the umi interface, so I'm not sure what is wrong here:

   "use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.TokenMetadataError = void 0;
const {UmiError} = require("@metaplex-foundation/umi");
class TokenMetadataError extends umi_1.UmiError {
    constructor(message, cause) {
        super(message, 'plugin', 'Token Metadata', cause);
        this.name = 'TokenMetadataError';
    }
}
exports.TokenMetadataError = TokenMetadataError;
//# sourceMappingURL=errors.js.map

[lorisleiva]

Hi there, I believe this is a dual package issue because Umi provides both esm and cjs packages whereas the generated libraries only export cjs at this time. Eventually all generated libraries will export both but for now I would suggest using a framework that resolve commonJs packages in ES modules. NextJS should work out of the box.