{"id":19905186,"url":"https://github.com/ossphilippines/v-animate-css","last_synced_at":"2025-04-07T06:07:17.975Z","repository":{"id":26310513,"uuid":"107954292","full_name":"OSSPhilippines/v-animate-css","owner":"OSSPhilippines","description":"The easiest to implement Vue directive for Animate.css","archived":false,"fork":false,"pushed_at":"2023-10-07T07:30:48.000Z","size":404,"stargazers_count":114,"open_issues_count":7,"forks_count":21,"subscribers_count":5,"default_branch":"main","last_synced_at":"2024-05-01T09:42:56.231Z","etag":null,"topics":["css","hacktoberfest","javascript","vue-directive","vuejs"],"latest_commit_sha":null,"homepage":"https://v-animate-css.ossph.org/","language":"HTML","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/OSSPhilippines.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":"CONTRIBUTING.md","funding":null,"license":"LICENSE","code_of_conduct":"CODE_OF_CONDUCT.md","threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null}},"created_at":"2017-10-23T08:36:11.000Z","updated_at":"2024-04-30T05:22:12.000Z","dependencies_parsed_at":"2024-01-02T23:38:13.137Z","dependency_job_id":"655e392e-9188-4c36-aafa-b0c00c187b72","html_url":"https://github.com/OSSPhilippines/v-animate-css","commit_stats":{"total_commits":80,"total_committers":7,"mean_commits":"11.428571428571429","dds":"0.38749999999999996","last_synced_commit":"391aa7fac6191abd7a8e2d31f0ed0ddb734949a5"},"previous_names":["jofftiquez/v-animate-css"],"tags_count":6,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/OSSPhilippines%2Fv-animate-css","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/OSSPhilippines%2Fv-animate-css/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/OSSPhilippines%2Fv-animate-css/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/OSSPhilippines%2Fv-animate-css/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/OSSPhilippines","download_url":"https://codeload.github.com/OSSPhilippines/v-animate-css/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":247601447,"owners_count":20964864,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["css","hacktoberfest","javascript","vue-directive","vuejs"],"created_at":"2024-11-12T20:31:55.877Z","updated_at":"2025-04-07T06:07:17.943Z","avatar_url":"https://github.com/OSSPhilippines.png","language":"HTML","funding_links":[],"categories":[],"sub_categories":[],"readme":"# **Vue Animate CSS**\n\n![GitHub forks](https://img.shields.io/github/forks/ossphilippines/v-animate-css?style=for-the-badge) ![GitHub Repo stars](https://img.shields.io/github/stars/ossphilippines/v-animate-css?style=for-the-badge)\n\n### `v-animate-css`\n\nAnimate.css for Vue.js 3\n\nIf you like this project, please give it a star :star: and consider following the author :octocat: :wink:.\n\n\u003e Vue 2 version is no longer maintained but [the code is available here](https://github.com/OSSPhilippines/v-animate-css/tree/version/vue-2). You can still contribute if you wish so, and we will publish them for Vue 2.\n\n### Installation using **NPM** \u003cimg src=\"https://raw.githubusercontent.com/devicons/devicon/master/icons/npm/npm-original-wordmark.svg\" width=\"30\" height=\"30\"\u003e\n\n```shell\nnpm install @ossph/v-animate-css --save\n```\n\n### OR\n\n### Installation using **YARN** \u003cimg src=\"https://raw.githubusercontent.com/devicons/devicon/master/icons/yarn/yarn-original.svg\" width=\"30\" height=\"30\"\u003e\n\n```shell\nyarn add @ossph/v-animate-css\n```\n\n### Or just **import** this to project without installing\n\n\n### Using **CDN** \n\n```script\nhttps://unpkg.com/@ossph/v-animate-css/dist/v-animate-css.js\n```\n\n## **Getting Started**\n\n### **Usage**\n\n```javascript\nimport Vue from 'vue';\nimport VAnimateCss from '@ossph/v-animate-css';\n\nVue.use(VAnimateCss);\n```\n\n```html\n\u003cscript src=\"https://cdnjs.cloudflare.com/ajax/libs/vue/2.4.4/vue.js\"\u003e\u003c/script\u003e\n\u003cscript src=\"https://unpkg.com/@ossph/v-animate-css/dist/v-animate-css.js\"\u003e\u003c/script\u003e\n\n\u003cscript\u003e\n  Vue.use(VAnimateCss.default);\n\u003c/script\u003e\n```\n\n### **Injecting Alternative CSS Link (local or CDN)**\n\nRelated to [Issue#33](https://github.com/OSSPhilippines/v-animate-css/issues/33) it make sense to give the user the option to add their own local version of Animate.css instead of relying to the default CDN version of Animate.css within the plugin.\n\nYou can do it using the new animateCSSPath option.\n\n```js\nimport Vue from 'vue';\nimport VAnimateCss from '@ossph/v-animate-css';\n\nVue.use(VAnimateCss, { animateCSSPath: './local-animate-css-file.css' });\n\n// You can also use this option to inject a newer version of Animate.css\nVue.use(VAnimateCss, { animateCSSPath: 'cdn-link-to-a-newer-animate-css-version' });\n```\n\nDemo and Docs [here](https://ossphilippines.github.io/v-animate-css/). \n\nMade with :heart: by [Joff Tiquez](https://github.com/jofftiquez)\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fossphilippines%2Fv-animate-css","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fossphilippines%2Fv-animate-css","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fossphilippines%2Fv-animate-css/lists"}