{"id":17033995,"url":"https://github.com/yisibell/vue-composition-wrapper","last_synced_at":"2025-04-12T12:51:49.068Z","repository":{"id":42158611,"uuid":"394537532","full_name":"yisibell/vue-composition-wrapper","owner":"yisibell","description":"A composition api wrapper for vue(2.x) vue-router(3.x) vuex(3.x).","archived":false,"fork":false,"pushed_at":"2024-02-18T02:48:18.000Z","size":1396,"stargazers_count":13,"open_issues_count":0,"forks_count":3,"subscribers_count":3,"default_branch":"main","last_synced_at":"2025-04-09T23:06:42.779Z","etag":null,"topics":["composition-api","vue","vue-router3","vue2","vueuse","vuex3"],"latest_commit_sha":null,"homepage":"","language":"JavaScript","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/yisibell.png","metadata":{"files":{"readme":"README.md","changelog":"CHANGELOG.md","contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null}},"created_at":"2021-08-10T05:38:10.000Z","updated_at":"2024-08-15T08:20:26.000Z","dependencies_parsed_at":"2023-12-08T08:45:44.689Z","dependency_job_id":null,"html_url":"https://github.com/yisibell/vue-composition-wrapper","commit_stats":{"total_commits":100,"total_committers":4,"mean_commits":25.0,"dds":0.56,"last_synced_commit":"bac3843fd3111bc4774650edad5d7abff0661219"},"previous_names":[],"tags_count":41,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/yisibell%2Fvue-composition-wrapper","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/yisibell%2Fvue-composition-wrapper/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/yisibell%2Fvue-composition-wrapper/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/yisibell%2Fvue-composition-wrapper/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/yisibell","download_url":"https://codeload.github.com/yisibell/vue-composition-wrapper/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":248571476,"owners_count":21126518,"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":["composition-api","vue","vue-router3","vue2","vueuse","vuex3"],"created_at":"2024-10-14T08:37:01.366Z","updated_at":"2025-04-12T12:51:49.051Z","avatar_url":"https://github.com/yisibell.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"\u003cp align=\"center\"\u003e\n  \u003ca href=\"https://www.npmjs.org/package/vue-composition-wrapper\"\u003e\n    \u003cimg src=\"https://img.shields.io/npm/v/vue-composition-wrapper.svg\"\u003e\n  \u003c/a\u003e\n  \u003ca href=\"https://npmcharts.com/compare/vue-composition-wrapper?minimal=true\"\u003e\n    \u003cimg src=\"https://img.shields.io/npm/dm/vue-composition-wrapper.svg\"\u003e\n  \u003c/a\u003e\n  \u003cbr\u003e\n\u003c/p\u003e\n\n# vue-composition-wrapper\n\nA **Vue Composition API** wrapper for `vue(2.x)` `vue-router(3.x)` `vuex(3.x)`.\nLet you use **Composition API** more conveniently in `vue 2.x` projects.\n\n- [Release Notes](./CHANGELOG.md)\n\n# Features\n\n- Access **Store** via `useStore` in `setup`.\n- Access **Route** and **Router** via `useRoute` and `useRouter` in `setup`.\n- Add navigation guard via `onBeforeRouteLeave` and `onBeforeRouteUpdate` in `setup`.\n- Access the current **Vue component instance** context via `getCurrentInstance` in `setup`.\n- Support `Typescript`.\n\n# Installation\n\n```bash\n# yarn\n$ yarn add vue-composition-wrapper\n\n# npm\n$ npm i vue-composition-wrapper\n```\n\n# APIs\n\n| Docs | Version | Support Vue version  | Support vue-router version |\n| :---: | :---: | :---: | :---: |\n| \u003ca href=\"./docs/v1.md\"\u003eCore API for v1\u003c/a\u003e | `v1.5.3` | `v2.6` and lower | - |\n| \u003ca href=\"./docs/v2.md\"\u003eCore API for v2\u003c/a\u003e | `v2.1.4` | `v2.7` | - |\n| \u003ca href=\"./docs/v3.md\"\u003eCore API for v3\u003c/a\u003e | `v3.0.0` | `v2.7` | `^3.6.5` |\n\n\n# Usage\n\n## For Vue(^2.7)\n\n1. In current version of `vue-compostion-wrapper`, the dependency on `@vue/compostion-api` has been removed. Directly use the built-in composition API of `vue@2.7`.\n2. Please install `vue-compostion-wrapper@latest`. The **npm tag** is now tagged as **latest**.\n\n``` bash\n# yarn\n$ yarn add vue-composition-wrapper@latest\n\n# npm \n$ npm i vue-composition-wrapper@latest\n```\n\n## For Vue(~2.6)\n\n1. To use **Composition API** in `vue(~2.6.x)`, you need to use \u003ca href=\"https://github.com/vuejs/composition-api\"\u003e @vue/composition-api \u003c/a\u003e.\n\n2. `@vue/composition-api` is included as **dependencies** of `vue-composition-wrapper@1.x`, so it will be installed automatically. If you already have `@vue/composition-api` in your project, please uninstall it first. Because if your `@vue/composition-api` version is too low, it may cause problems.\n\n3. Install `@vue/composition-api` as a **Vue plugin**.\n\n```js\n// @/plugins/vue-compostion-api.js\nimport Vue from 'vue'\nimport VueCompositionAPI from '@vue/composition-api'\n\nVue.use(VueCompositionAPI)\n```\n\nThen, import it in your `main.js`.\n\n```js\n// ...\n\nimport '@/plugins/vue-composition-api.js'\n\n// ...\n```\n\n4. If your project has not planned to upgrade `vue` to **2.7.x**, and uses the **1.x version** of `vue-composition-wrapper`. Remember to lock the version updates of `vue` and `vue-template-compiler` to the **patch version** of **2.6**.\n\n```json\n{\n  \"dependencies\": {\n    \"vue\": \"~2.6.14\"\n  },\n  \"devDependencies\": {\n    \"vue-template-compiler\": \"~2.6.14\"\n  }\n}\n```\n\n\n\n\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fyisibell%2Fvue-composition-wrapper","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fyisibell%2Fvue-composition-wrapper","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fyisibell%2Fvue-composition-wrapper/lists"}