Correct way to create WordPress Gutenberg Blocks using third party libraries

Viewed 16

I'm currently getting into coding gutenberg blocks for wordpress and something I came across and couldn't find an answer to yet is: How would you correctly create a gutenberg block that uses (for example) css and js from third-party libraries like Bootstrap / Material UI etc.

So if I would code a block that prints out a Bootstrap Carousel (https://getbootstrap.com/docs/5.2/components/carousel/), I would obviously need to make sure that the bootstrap css and js is loaded. Of course, I could enqueue the styles and scripts in my php code for my gutenberg block. But what if I later decide to create a second gutenberg block for a Bootstrap Card (https://getbootstrap.com/docs/5.2/components/card/) for example. I would yet again have to include the bootstrap css and js. How would I make sure it doesn't get loaded twice? Okay, sure, I'm currently in control of all that because I was the guy creating those two blocks. But what if I want to install a WordPress Plugin that provides a gutenberg block for a Bootstrap progress bar or whatever. That plugin would also in some way load bootstrap, right?

So I'm totally aware there is an answer to that and it is probably already answered inside some code of any "open source wordpress bootstrap gutenberg block plugin" (which totally exists, for example there is https://github.com/liip/bootstrap-blocks-wordpress-plugin), but reading the code I couldn't figure it out.

So any help would be appreciated.

0 Answers
Related