Closed ninjaPixel closed 5 years ago
Thank you for finding this bug. I'll do a little brainstorming to see if it could be something on chessboardjsx's end.
Cool seeing the project used with hooks, that's a first for me
Thank you, @willb335!!
Still not sure of the cause here. Just to rehash, when built for production, the pieces move incorrectly when the position
prop is updated. The behavior is not there when running in development with CRA. The behavior is fixed when minification is turned off via the webpack.config.js
.
At the very least, I'm hoping similar issues regarding the positon
prop run across this issue. Thanks again
Using
chessboardjsx
with Create React App I noticed that there is funny behaviour when the app is built for production.Using
chess.js
to generate random moves, my component looks like this:Everything works fine when I run my CRA app using
yarn start
however, when built for production all the pieces move when theposition
prop is updated.I've uploaded a short screencast to DropBox, and below is a screenshot:
I've reproduced the issue in this repo: https://github.com/ninjaPixel/chessboardjsx-issue
You can run it by executing:
I've also ejected the CRA app on this branch: https://github.com/ninjaPixel/chessboardjsx-issue/tree/eject If you modify the webpack config file, line 179 to turn the minification off, then the weird behaviour stops.
I'm not sure if this is an issue with
terser-webpack-plugin
orchessboardjsx
but it's worth mentioning sinceterser-webpack-plugin
is currently the de-facto minifier for webpack so it's likely that others may experience this issue.