DEV Community

Mikhail Panichev
Mikhail Panichev

Posted on

2

Easy data animations in Vue with Vuenime

Few times in a row I have been creating data visualizations with animations that incapable of CSS transitions. Every time I implemented all animation logic from scratch using Animejs.
Except for the last one when I realized that the combination of the watch property and anime call can provide a simple way to create a wrapper component for declarative animations.

And I wrote it.

Then I discovered that there are no such packages in npm. Okay, there is vue-anime but it just adds $anime to Vue prototype and provides v-anime directive (which is limited to DOM node; also I don't use directives at all because of JSX).

And I made an npm package.

Frankly, it was a long process of finding free time, deciding how to provide documentation, which features are necessary for release, and so on. But I turned off the perfectionism and here it is!

I hope you find this package useful and give me some feedback!

NPM Package
GitHub Repo
Storybook

Sentry blog image

How I fixed 20 seconds of lag for every user in just 20 minutes.

Our AI agent was running 10-20 seconds slower than it should, impacting both our own developers and our early adopters. See how I used Sentry Profiling to fix it in record time.

Read more

Top comments (0)

Image of Docusign

🛠️ Bring your solution into Docusign. Reach over 1.6M customers.

Docusign is now extensible. Overcome challenges with disconnected products and inaccessible data by bringing your solutions into Docusign and publishing to 1.6M customers in the App Center.

Learn more