{"id":15163434,"url":"https://github.com/brandon689/wpfvitereacthost","last_synced_at":"2026-02-03T11:34:52.034Z","repository":{"id":251045905,"uuid":"836220904","full_name":"Brandon689/WpfViteReactHost","owner":"Brandon689","description":"WPF React Desktop App","archived":false,"fork":false,"pushed_at":"2024-07-31T12:57:59.000Z","size":238,"stargazers_count":0,"open_issues_count":0,"forks_count":0,"subscribers_count":1,"default_branch":"master","last_synced_at":"2025-03-26T03:41:48.283Z","etag":null,"topics":["css","electron","html","native","react","webview2","wpf"],"latest_commit_sha":null,"homepage":"","language":"C#","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/Brandon689.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE.txt","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-07-31T11:55:34.000Z","updated_at":"2024-07-31T12:58:05.000Z","dependencies_parsed_at":null,"dependency_job_id":"b1778f07-8fa7-483b-9604-84cbd04a90f4","html_url":"https://github.com/Brandon689/WpfViteReactHost","commit_stats":null,"previous_names":["brandon689/wpfvitereacthost"],"tags_count":0,"template":false,"template_full_name":null,"purl":"pkg:github/Brandon689/WpfViteReactHost","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Brandon689%2FWpfViteReactHost","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Brandon689%2FWpfViteReactHost/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Brandon689%2FWpfViteReactHost/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Brandon689%2FWpfViteReactHost/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/Brandon689","download_url":"https://codeload.github.com/Brandon689/WpfViteReactHost/tar.gz/refs/heads/master","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Brandon689%2FWpfViteReactHost/sbom","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":263287853,"owners_count":23443084,"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","electron","html","native","react","webview2","wpf"],"created_at":"2024-09-27T02:42:12.323Z","updated_at":"2026-02-03T11:34:51.986Z","avatar_url":"https://github.com/Brandon689.png","language":"C#","funding_links":[],"categories":[],"sub_categories":[],"readme":"# WPF Vite React Host\n\nThis project demonstrates how to host a Vite-built React application within a WPF application using WebView2. ASP.NET is not required, there is just an ASP Core project to show how you can use an API.\n\n## VS Electron\n- Only 40mb of memory instead of around 100mb.\n- WebView2 uses Edge, which is chromium based, so its similar to Electron.\n- Not cross platform, Edge dependency. Could use CEFSharp instead.\n\n# How to dev\n- Run the vite app with pnpm run dev as you would normally and view it in browser\n- Run the ASP server if you're using it, you can delete it if not using\n- In production, follows steps 2 and 3 of getting started below and run the WPF app.\n- Its more convenient to use the normal browser in development.\n\n![Screenshot of the application](screenshot.png)\n\n## Features\n\n- WPF application serving as a host for a React app\n- React app built with Vite for fast development and optimized production builds\n- WebView2 integration for rendering the React app within WPF\n- Example of fetching data from an ASP.NET Core Web API\n\n## Prerequisites\n\n- .NET Framework or .NET Core (version used in the project)\n- Node.js and npm (for React development)\n- WebView2 Runtime\n\n## Getting Started\n\n1. Clone the repository\n2. Navigate to the React app directory and run:\n\n    ```sh\n    pnpm install\n    pnpm run build\n    ```\n\n3. Copy all the files in dist into the ReactApp folder. Set each file to copy to ouput directory, copy if newer in Visual Studio.\n\n## How It Works\n\nThe WPF application uses WebView2 to load the React application. The React app is built and its output is placed in a directory that the WPF app can access. WebView2 is configured to use a virtual host, allowing the React app to make API calls without CORS issues.\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fbrandon689%2Fwpfvitereacthost","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fbrandon689%2Fwpfvitereacthost","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fbrandon689%2Fwpfvitereacthost/lists"}