{"id":17925417,"url":"https://github.com/scottbedard/vue-forward","last_synced_at":"2025-04-03T09:40:42.832Z","repository":{"id":241231258,"uuid":"774109624","full_name":"scottbedard/vue-forward","owner":"scottbedard","description":"The missing createApp function from Vue 2.7","archived":false,"fork":false,"pushed_at":"2024-05-23T04:54:29.000Z","size":141,"stargazers_count":1,"open_issues_count":0,"forks_count":0,"subscribers_count":1,"default_branch":"main","last_synced_at":"2025-04-01T14:13:10.785Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":"","language":"TypeScript","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/scottbedard.png","metadata":{"files":{"readme":"README.md","changelog":null,"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,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2024-03-19T00:42:15.000Z","updated_at":"2024-05-24T15:59:39.000Z","dependencies_parsed_at":"2024-05-23T04:46:27.514Z","dependency_job_id":"06c5d827-b86e-4ac7-9d55-e238dad3f355","html_url":"https://github.com/scottbedard/vue-forward","commit_stats":null,"previous_names":["scottbedard/vue-forward"],"tags_count":10,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/scottbedard%2Fvue-forward","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/scottbedard%2Fvue-forward/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/scottbedard%2Fvue-forward/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/scottbedard%2Fvue-forward/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/scottbedard","download_url":"https://codeload.github.com/scottbedard/vue-forward/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":246981154,"owners_count":20863825,"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":[],"created_at":"2024-10-28T20:55:59.877Z","updated_at":"2025-04-03T09:40:42.801Z","avatar_url":"https://github.com/scottbedard.png","language":"TypeScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# `@bedard/vue-forward`\n\n[![Test](https://github.com/scottbedard/vue-forward/actions/workflows/test.yml/badge.svg)](https://github.com/scottbedard/vue-forward/actions/workflows/test.yml)\n[![Codecov](https://img.shields.io/codecov/c/github/scottbedard/vue-forward?token=IQSd84vERj)](https://codecov.io/gh/scottbedard/vue-forward)\n[![NPM](https://img.shields.io/npm/v/%40bedard%2Fvue-forward)](https://www.npmjs.com/package/@bedard/vue-forward)\n[![License](https://img.shields.io/badge/license-MIT-blue)](https://github.com/scottbedard/vue-forward/blob/main/LICENSE)\n\nBehold, the missing [`createApp`](https://vuejs.org/api/application.html#createapp) function from Vue 2.7!\n\nForward compatibility is key to migrating large, complex codebases. Vue 2.7 provides many 3.x features, but it's missing the critical `createApp` function. This project implements that function, allowing you to minimize the diff on a migration branch.\n\nA typical migration might look like this...\n\n1. Refactor from `new Vue(...)` to `createApp(...)`\n2. Migrate anything else that isn't forward-compatible, [see here \u0026rarr;](https://v3-migration.vuejs.org/breaking-changes/)\n3. Upgrade to 3.1 and remove this library 🎉\n\nNow that we know the plan, [`npm install @bedard/vue-forward`](https://www.npmjs.com/package/@bedard/vue-forward)\n\n## Getting started\n\nA core concept in Vue 3 is [the application instance](https://vuejs.org/guide/essentials/application.html#the-application-instance). It's responsible for the root component and registering any globals. Here we'll use it to create a component tree and mount it to the DOM.\n\n```js\nimport { createApp } from '@bedard/vue-forward'\n\nconst app = createApp(App)\n  .use(router)\n  .mixin(i18n)\n\napp.mount('#app')\n```\n\nFor any root props or event listeners, we'll use the same naming conventions as Vue 3.\n\n```js\ncreateApp(User, {\n  username: 'bob',\n  onClick() {\n    // ...\n  },\n})\n```\n\nAttach to the DOM using [`mount`](https://vuejs.org/api/application.html#app-mount). This uses [3.x mouting behavior](https://v3-migration.vuejs.org/breaking-changes/mount-changes.html#mounted-application-does-not-replace-the-element), inserting as a child node rather than replacing the target.\n\n```js\napp.mount('#target')\n```\n\nCall [`unmount`](https://vuejs.org/api/application.html#app-unmount) to destroy the instance. Once unmounted, an app cannot be mounted again.\n\n```js\napp.unmount()\n```\n\n## Vuex \u0026 Vue Router\n\nUse [`createStore`](https://vuex.vuejs.org/api/#createstore) and [`createRouter`](https://router.vuejs.org/api/#createRouter) to create a forward compatible stores and routers.\n\n```js\nimport { createApp, createRouter, createStore, createWebHistory } from '@bedard/vue-forward'\n\nconst router = createRouter({\n  history: createWebHistory(),\n  routes: [ ... ],\n})\n\nconst store = createStore({\n  state: { ... }\n})\n\ncreateApp(App)\n  .use(store)\n  .use(router)\n```\n\n## License\n\n[MIT](https://github.com/scottbedard/vue-forward/blob/main/LICENSE)\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fscottbedard%2Fvue-forward","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fscottbedard%2Fvue-forward","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fscottbedard%2Fvue-forward/lists"}