search

oakmac / chessboardjs

JavaScript chessboard
https://chessboardjs.com
MIT License
2k stars 406 forks source link

How to import chessboard.js in Vue App #226

Open Shivakumar-ZugZwang opened 2 years ago

Shivakumar-ZugZwang commented 2 years ago

Hi I'm a beginner in Software Development

I have used chessboard.js in plain vanilla js but I'm not able to implement it in Vue.js can you help me out in integrating it even I tried npm install it but it was not working fine when I tried to resolve this issue I found it is not exported so we are not able to import it

can we get an update of npm or release any doc which helps to integrate chessboard.js in Vue

leo848 commented 1 year ago

Take a look at chessboardjs-vue.

Nevermind, this doesn't seem to be working. I just chose to use it via a CDN in the index.html file.

BaoAn21 commented 1 year ago

leo848: Can you show me the way to use it via CDN? Thank a lot

leo848 commented 1 year ago

@BaoAn21

I now switched to chessground, an alternative that works much better imo (better API, a lot more useful functionality, is responsive on mobile while #74 etc. have not been resolved for a decade (!), and much more). You can use chessground via npm or another package manager, it is very easy in combination with Vue.

If you still want to use chessboard.js for whatever reason, you can look here and copy the snippets from "Content Delivery Network" into your index.html. You can then use window.Chessboard as you would in a normal, framework-free context. But I would still recommend switching to chessground for every app that's not just for throwaway use.

benjaminpjones commented 1 year ago

See also https://github.com/oakmac/chessboardjs/issues/157

It's a shame - I was drawn to this library because it is really well documented, but not being able to import is a hard blocker. I will try one of the chessground wrappers instead.