I created a react app where react-chessground works with chessground@7.16.13
And now I'm tryin to upgrade chessground to version 8.2.1, but there are 8 errors like:
ERROR in ./node_modules/react-chessground/node_modules/chessground/chessground.js 1:0-30
Module not found: Error: Can't resolve './api' in 'C:\User\file\node_modules\react-chessground\node_modules\chessground'
Did you mean 'api.js'?
BREAKING CHANGE: The request './api' failed to resolve only because it was resolved as fully specified
(probably because the origin is strict EcmaScript Module, e. g. a module with javascript mimetype, a '*.mjs' file, or a '*.js' file where the package.json contains '"type": "module"').
The extension in the request is mandatory for it to be fully specified.
Add the extension to the request.
The same for './config', './state', './wrap', './events', './render', './svg', './util'.
This is my code:
import { useState } from "react";
import Chessground from "react-chessground";
import "./chess.css";
import "./styles.css";
import "./theme.css";
import toDests from "./to-dests";
import { Chess } from "chess.js";
export default function Board() {
const [fen, setFen] = useState(
"rnbqkbnr/pppppppp/8/8/8/8/PPPPPPPP/RNBQKBNR w KQkq - 0 1"
);
const chess = new Chess(fen);
const turnColor = chess.turn() === "w" ? "white" : "black";
const handleMove = ( from, to ) => {
chess.move({ from, to, promotion: "q" });
setFen(chess.fen());
};
return (
<div className="justChessBoard">
<div>
<Chessground
fen={fen}
turnColor={turnColor}
onMove={handleMove}
movable={toDests(chess)}
/>
</div>
</div>
);
}
Am I doing something wrong or it just doesn't work together?