Update "@coral-xyz/anchor" package to support ES Module format for workspace.js

[shirecoding]

Hi, I am currently using sveltekit and seem to be hitting this error. I don't seem to be able to fix it on my end and it seems like some misconfigured imports on the package. It looks like anchor can only be used on the backend nodejs? I currently have to split my code to make sure anchor doesnt get bundled or called from the frontend code else i get this error.

node_modules/@coral-xyz/anchor/dist/esm/workspace.js:1 seems to be an ES Module but shipped in a CommonJS package. You might want to create an issue to the package "@coral-xyz/anchor" a
sking them to ship the file in .mjs extension or add "type": "module" in their package.json.

Not sure if its just a simple fix?

Thanks!

[shirecoding]

I notice that anchor/dist/esm are not using .mjs extension, and there is no type: module in the package.json?

[shirecoding]

i think the problem lies in esm/index.js

can we change it to? we shouldnt be using require in esm right? seems like vitest is not allowing it

// if (!isBrowser) {
//     exports.workspace = require("./workspace.js").default;
//     exports.Wallet = require("./nodewallet.js").default;
// }

if (!isBrowser) {
    import("./workspace.js")
        .then(module => {
            exports.workspace = module.default;
        });

    import("./nodewallet.js")
        .then(module => {
            exports.Wallet = module.default;
        });
}

[acheroncrypto]

It looks like anchor can only be used on the backend nodejs?

This is not correct as many projects in the Solana ecosystem use the @coral-xyz/anchor package in their frontend.

You can check out the create-solana-dapp repository and its Anchor template.

we shouldnt be using require in esm right?

Most bundlers support require for compatibility reasons. Seems like yours isn't, at least by default, so I'd first check if there is a setting to enable that. If not, we can look to improve the situation from our side without breaking the existing usage.

[shirecoding]

Currently using vitest and it fails as mentioned, i think they have some checks, the only way i can make it work is to change esm/index.js to the following:

if (!isBrowser) {
    import("./workspace.js")
        .then(module => {
            exports.workspace = module.default;
        });

    import("./nodewallet.js")
        .then(module => {
            exports.Wallet = module.default;
        });
}

I think this is an issue with vitest that is quite strict with mixing require and esm, but to make it more compatible, maybe we should make it consistent? Using require inside esm might cause some other bundles or frameworks to detect or reject it as an error