SyntaxError: The requested module 'chessground' does not provide an export named 'Chessground'

[lindemer]

This is identical to PR #13. I'm experiencing the same issue on a blank Next.js project.

npx create-next-app --example with-docker nextjs-docker
cd nextjs-docker
npm i @react-chess/chessground

Add the import commands and a <Chessground /> then run npm run dev to replicate. Help is much appreciated!

[inyono]

Seems like the esm build imports chessground via named export although it is a default export. The following diff solved the problem for me:

diff --git a/node_modules/@react-chess/chessground/build/esm/index.js b/node_modules/@react-chess/chessground/build/esm/index.js
index ee6b8ca..612ed43 100644
--- a/node_modules/@react-chess/chessground/build/esm/index.js
+++ b/node_modules/@react-chess/chessground/build/esm/index.js
@@ -10,7 +10,7 @@ var __assign = (this && this.__assign) || function () {
     return __assign.apply(this, arguments);
 };
 import React, { useEffect, useRef, useState } from 'react';
-import { Chessground as ChessgroundApi } from 'chessground';
+import ChessgroundApi from 'chessground';
 function Chessground(_a) {
     var _b = _a.width, width = _b === void 0 ? 900 : _b, _c = _a.height, height = _c === void 0 ? 900 : _c, _d = _a.config, config = _d === void 0 ? {} : _d, _e = _a.contained, contained = _e === void 0 ? false : _e;
     var _f = useState(null), api = _f[0], setApi = _f[1];

Maybe there was a breaking change in the chessground package at some point.

[nagraj98]

@inyono Much appreciated brother ! Worked like a charm.

Also, Is there any other well maintained library for this ? I thought chessground would be better than chessboardjsx

[bezalel6]

I ended up here because I got the same error, if anyone stumbles upon this in the future, changing to this import is what fixed it for me:

import dynamic from 'next/dynamic';
const Chessground = dynamic(() => import('@react-chess/chessground'), {
    ssr: false
});