{"id":17976759,"url":"https://github.com/unixzii/revue","last_synced_at":"2025-05-06T20:47:25.957Z","repository":{"id":181236098,"uuid":"666447325","full_name":"unixzii/revue","owner":"unixzii","description":"A library for bridging React components to Vue.","archived":false,"fork":false,"pushed_at":"2023-07-15T07:23:03.000Z","size":79,"stargazers_count":13,"open_issues_count":0,"forks_count":1,"subscribers_count":2,"default_branch":"main","last_synced_at":"2025-03-31T02:42:22.955Z","etag":null,"topics":["bridge","framework","frontend","javascript","react","vue","web"],"latest_commit_sha":null,"homepage":"https://revue.vercel.app","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/unixzii.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}},"created_at":"2023-07-14T14:39:20.000Z","updated_at":"2023-07-20T13:10:55.000Z","dependencies_parsed_at":"2023-07-14T16:32:11.666Z","dependency_job_id":null,"html_url":"https://github.com/unixzii/revue","commit_stats":null,"previous_names":["unixzii/revue"],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/unixzii%2Frevue","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/unixzii%2Frevue/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/unixzii%2Frevue/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/unixzii%2Frevue/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/unixzii","download_url":"https://codeload.github.com/unixzii/revue/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":252769136,"owners_count":21801373,"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":["bridge","framework","frontend","javascript","react","vue","web"],"created_at":"2024-10-29T17:24:59.932Z","updated_at":"2025-05-06T20:47:25.934Z","avatar_url":"https://github.com/unixzii.png","language":"TypeScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# revue\n\nA library for bridging React components to Vue.\n\n\u003e This library is currently a PoC, only for demostrating the possibility of using React components in Vue.\n\n## Features\n\n* Updates of React components are fully driven by reactivity.\n* Single React root per Vue app, providing more friendly devtools experience.\n* The context of a React component are synchronized within the Vue component tree. \n\n## Getting Started\n\nFirst, define the bridge component (e.g. in `button.ts`):\n\n```typescript\nimport { h } from 'vue';\nimport { Button } from '@nextui-org/react';\nimport { defineReactComponent } from 'revue';\n\nexport default defineReactComponent(Button, {\n    onClick: Function,\n}, {\n    containerRender() {\n        return h('div', {\n            style: { display: 'inline-block' }\n        });\n    },\n});\n```\n\nSince every React component must be mounted on a DOM element, you can customize the host element by specifying `containerRender`.\n\nThen you can use your favorite React component in any Vue component:\n\n```vue\n\u003ctemplate\u003e\n  \u003cdiv\u003e\n    \u003cButton :onClick=\"sayHello\"\u003eSay Hello\u003c/Button\u003e\n  \u003c/div\u003e\n\u003c/template\u003e\n\n\u003cscript lang=\"ts\" setup\u003e\nimport Button from './button';  // Import the bridged component.\n\nfunction sayHello() {\n    console.log('Hello, world!');\n}\n\u003c/script\u003e\n```\n\n## Example\n\nClone the repository, and run the following command to serve the example locally:\n\n```bash\nnpm install\nnpm run dev\n```\n\n## License\n\nMIT","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Funixzii%2Frevue","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Funixzii%2Frevue","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Funixzii%2Frevue/lists"}