DEV Community

Cover image for tsParticles React and Vue packages are changing!
Matteo Bruni for tsParticles

Posted on • Updated on

tsParticles React and Vue packages are changing!

Changing? Why?

Starting from today the official tsParticles React.js and Vue.js (2.x and 3.x) packages have a new name.

Don't worry, the previous packages are still maintained and updated, until tsParticles version 3.x, but that's another story.

So what has changed?

React.js

react-tsparticles becomes react-particles, same version (starting from 2.1.3, the latest version that you should use πŸ‘€), you can just remove the ts from the package and you're done.

Vue.js

2.x

particles.vue becomes vue2-particles, one major version down. If you are using the version 3.1.3 (the latest, and I really hope you are using this πŸ‘€), you have to downgrade that version to 2.1.3 (so it's the exact version of tsParticles)

particles.vue had a major version change when tsParticles was still in v1 because of a major change.
Since vue2-particles is a fresh package, I decided to keep its version aligned with the main package.

3.x

particles.vue3 becomes vue3-particles, same version (starting from 2.0.3, but I recommend using always the latest version, at the moment is 2.1.3).

Recap

A small recap to be clear in few lines:

react-tsparticles -> react-particles, starting from 2.1.3, no different version numbers

particles.vue -> vue2-particles, starting from 3.0.3/2.0.3, they'll have a different major version, but they share the same code

particles.vue3 -> vue3-particles, starting form 2.0.3, no different version numbers

A migration is really suggested, since the "old" packages could become obsolete in the future.

Another thing...

I've launched the tsParticles official sub reddit here: https://www.reddit.com/r/tsParticles

You can also see a full list of tsParticles official components here

Reddit Logo All tsParticles Official Components


GitHub logo matteobruni / tsparticles

tsParticles - Easily create highly customizable JavaScript particles effects, confetti explosions and fireworks animations and use them as animated backgrounds for your website. Ready to use components available for React.js, Vue.js (2.x and 3.x), Angular, Svelte, jQuery, Preact, Inferno, Solid, Riot and Web Components.

Top comments (3)

Collapse
 
joelbonetr profile image
JoelBonetR πŸ₯‡ • Edited

Is it really necessary to differentiate one from the other?

Didn't check the code yet but you may be fine using just a single js/ts lib and create different usage documentation for different frameworks/libs.

Or is that you mind to provide components directly instead? I'd need to check the details but usually a component is just a function so you should be fine here as well with a single lib to maintain.

Collapse
 
matteobruni profile image
Matteo Bruni

I preferred with prebuilt components so they're easier to use and the user has to read only few lines of code instead of the library usage code that could be more difficult to comprehend.

Every component is different from others because I try to use every feature that I know that library/framework has, for example in Angular there's a native check of SSR, in React I'm deep checking the options changes, and so on...

This gave me also some liberty on the components' code since I could improve their code without updating the documentation.

And last but not least, I prefer to have everything built in the same repository instead of having developer x or y that creates an "unofficial" component, so I can give support on everything I've made, otherwise I have to explain what was changed and why everything broke. I already tried that way and it was a mess, just because the unofficial component used some different default values.

Collapse
 
joelbonetr profile image
JoelBonetR πŸ₯‡

Oh got it! 😁