{"id":20660624,"url":"https://github.com/armoniacore/armonia-vite","last_synced_at":"2025-04-19T15:10:17.728Z","repository":{"id":57210083,"uuid":"478073321","full_name":"armoniacore/armonia-vite","owner":"armoniacore","description":"Almost bare-metal plugin for multiplatform development in vite, it's even faster.","archived":false,"fork":false,"pushed_at":"2022-10-26T10:38:49.000Z","size":961,"stargazers_count":3,"open_issues_count":1,"forks_count":0,"subscribers_count":0,"default_branch":"main","last_synced_at":"2025-03-29T09:11:44.479Z","etag":null,"topics":["electron","playground","server-side-rendering","ssg","ssr","static-site-generator","vite"],"latest_commit_sha":null,"homepage":"https://vite.armoniacore.com/","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/armoniacore.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":"CODE_OF_CONDUCT.md","threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2022-04-05T10:11:53.000Z","updated_at":"2023-06-10T09:16:06.000Z","dependencies_parsed_at":"2022-08-29T14:11:42.099Z","dependency_job_id":null,"html_url":"https://github.com/armoniacore/armonia-vite","commit_stats":null,"previous_names":[],"tags_count":12,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/armoniacore%2Farmonia-vite","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/armoniacore%2Farmonia-vite/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/armoniacore%2Farmonia-vite/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/armoniacore%2Farmonia-vite/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/armoniacore","download_url":"https://codeload.github.com/armoniacore/armonia-vite/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":249722930,"owners_count":21315906,"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":["electron","playground","server-side-rendering","ssg","ssr","static-site-generator","vite"],"created_at":"2024-11-16T19:05:35.293Z","updated_at":"2025-04-19T15:10:17.698Z","avatar_url":"https://github.com/armoniacore.png","language":"TypeScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"\u003cbr /\u003e\n\n\u003cdiv align=\"center\"\u003e\n  \u003cimg src=\"./docs/logo.png\" width=\"560\" /\u003e\n\u003c/div\u003e\n\n\u003cdiv align=\"center\"\u003e\n  ⚡️ Vite plugin for quick cross-platform application development ⚡️\n\u003c/div\u003e\n\n\u003cbr /\u003e\n\n\u003cdiv align=\"center\"\u003e\n\n  [![downloads](https://img.shields.io/npm/dw/@armonia/vite?style=for-the-badge)](https://npmjs.com/package/@armonia/vite)\n  [![npm](https://img.shields.io/npm/v/@armonia/vite.svg?style=for-the-badge\u0026color=yellowgreen)](https://npmjs.com/package/@armonia/vite)\n  [![license](https://img.shields.io/github/license/armoniacore/armonia-vite.svg?style=for-the-badge)](LICENSE)\n\n\u003c/div\u003e\n\n\u003cdiv align=\"center\"\u003e\n  \u003ca href=\"https://github.com/armoniacore/armonia-vite/discussions\"\u003eAsk a Question\u003c/a\u003e\n\u003c/div\u003e\n\n\u003cbr /\u003e\n\n\u003cdiv align=\"center\"\u003e\n\n  [![docs](https://img.shields.io/static/v1?label=docs\u0026message=vite.armoniacore.com\u0026style=for-the-badge\u0026color=informational)](https://vite.armoniacore.com/)\n\n\u003c/div\u003e\n\n\u003cdetails open=\"open\"\u003e\n\u003csummary\u003eTable of Contents\u003c/summary\u003e\n\n- [About](#about)\n- [Getting Started](#getting-started)\n  - [For Electron](#for-electron)\n  - [For SSR](#for-ssr)\n  - [For SSG](#for-ssg)\n- [Roadmap](#roadmap)\n- [Contributing](#contributing)\n- [Support](#support)\n- [License](#license)\n\n\u003c/details\u003e\n\n---\n\n## About\n\n**Armonia** is a vite plugin for quick application development.\n\nAlmost bare metal, **Armonia** allows you to develop and build application across multiple target without leaving the comfort of vite.\n\nIt currently supports:\n\n- SSR\n- SSG (preview)\n- Electron\n\nRead the [online documentation](https://vite.armoniacore.com/), explore the [examples](/packages/playground/) or take a look at the [not so starter project](https://github.com/armoniacore/starter-template-vue-ts).\n\n## Getting Started\n\nIn your vite project install `armonia` and `cross-env`:\n\n```bash\n$ pnpm i @armonia/vite cross-env -D\n```\n\nAdd the `armonia` plugin to your `vite.config.ts`\n\n```ts\n// vite.config.ts\nimport { defineConfig } from 'vite'\nimport { armonia } from '@armonia/vite'\n\nexport default defineConfig({\n  plugins: [armonia()]\n})\n```\n\n### For Electron\n\n\u003cdetails open\u003e\n\u003cbr\u003e\n\nInstall `electron` and `electron-builder`:\n\n```bash\n$ pnpm i electron electron-builder -D\n```\n\nCreate the file `src-electron/index.ts`, it will be automatically discovered by Armonia:\n\n```ts\n// src-electron/index.ts\nimport { app, BrowserWindow } from 'electron'\n\nlet mainWindow: BrowserWindow | undefined\n\nfunction createWindow() {\n  mainWindow = new BrowserWindow({\n    width: 800,\n    height: 600,\n    useContentSize: true\n  })\n\n  if (import.meta.env.DEV) {\n    mainWindow.loadURL(import.meta.env.ELECTRON_APP_URL)\n    mainWindow.webContents.openDevTools()\n  } else {\n    mainWindow.webContents.on('devtools-opened', () =\u003e {\n      mainWindow.webContents.closeDevTools()\n    })\n\n    mainWindow.loadFile(import.meta.env.ELECTRON_APP_URL)\n  }\n\n  mainWindow.on('closed', () =\u003e {\n    mainWindow = null\n  })\n}\n\napp.whenReady().then(createWindow)\n\napp.on('window-all-closed', () =\u003e {\n  if (process.platform !== 'darwin') {\n    app.quit()\n  }\n})\n\napp.on('activate', () =\u003e {\n  if (mainWindow == null) {\n    createWindow()\n  }\n})\n```\n\nAdd new `scripts` in your package.json\n\n```json\n\"scripts\": {\n  \"dev:electron\": \"cross-env ARMONIA_TARGET=electron vite\",\n  \"build:electron\": \"cross-env ARMONIA_TARGET=electron vite build\",\n}\n```\n\nRun the project with:\n\n```bash\n$ pnpm dev:electron\n```\n\nBuild the project with:\n\n```bash\n$ pnpm build:electron\n```\n\n---\n\n\u003c/details\u003e\n\n### For SSR\n\n\u003cdetails open\u003e\n\u003cbr\u003e\n\nCreate the file `src/entry-server.ts`, it will be automatically discovered by Armonia. This will be your main entry point for the server-side code and it will run on `node`.\n\n```ts\n// src/entry-server.ts\n\n// import the ssr manifest\nimport manifest from 'ssr:manifest'\n\n// import the index.html string\nimport template from 'ssr:template'\n\nexport async function render(req: Request): Promise\u003cstring\u003e {\n  // execute your custom logic to render the page\n  const app = await createAppToRoute(req.originalUrl)\n\n  const appHtml = await renderToString(app, ctx)\n\n  // inject the template\n  return template\n    .replace('\u003c/head\u003e', `${preloadLinks}\u003c/head\u003e`)\n    .replace('\u003cdiv id=\"app\"\u003e\u003c/div\u003e', `\u003cdiv id=\"app\"\u003e${appHtml}\u003c/div\u003e`)\n}\n```\n\nAdd new `scripts` in your package.json\n\n```json\n\"scripts\": {\n  \"dev:ssr\": \"cross-env ARMONIA_TARGET=ssr vite\",\n  \"build:ssr\": \"cross-env ARMONIA_TARGET=ssr vite build\",\n}\n```\n\nRun the project with:\n\n```bash\n$ pnpm dev:ssr\n```\n\nBuild the project with:\n\n```bash\n$ pnpm build:ssr\n```\n\n---\n\n\u003c/details\u003e\n\n### For SSG\n\n\u003cdetails open\u003e\n\u003cbr\u003e\n\nFollow the [SSR steps](#for-ssr).\n\nUpdate your `vite.config.ts` to support SSG:\n\n```ts\n// vite.config.ts\narmonia({\n  ssg: {\n    async staticRender({ render }) {\n      const code = await render('/')\n\n      // return a list file and text\n      return [\n        {\n          id: '/index.html',\n          code\n        }\n      ]\n    }\n  }\n})\n```\n\n`staticRender` will be executed when building the `SSG` target, `render` is the name of the exported function from the `src/entry-server.ts` file.\n\nAdd new `scripts` in your package.json\n\n```json\n\"scripts\": {\n  \"build:ssg\": \"cross-env ARMONIA_TARGET=ssg vite build\",\n}\n```\n\nRun the project in ssr:\n\n```bash\n$ pnpm dev:ssr\n```\n\nBuild the project with:\n\n```bash\n$ pnpm build:ssg\n```\n\n---\n\n\u003c/details\u003e\n\n## Roadmap\n\nSee the [open issues](https://github.com/armoniacore/armonia-vite/issues) for a list of proposed features (and known issues).\n\n- [ ] Add support for Capacitor\n- [ ] Provide examples and templates for `react` and `svelte`\n- [ ] Stabilize the API\n- [ ] Improve the documentation\n- [ ] Implement a specialized CLI\n- [ ] Actually do a proper CHANGELOG\n- [ ] Workflow, everybody likes workflows\n- [ ] Tests, tests and more tests\n\n## Contributing\n\nFirst off, thanks for taking the time to contribute! Contributions are what makes the open-source community such an amazing place to learn, inspire, and create. Any contributions you make will benefit everybody else and are **greatly appreciated**.\n\nPlease try to create bug reports that are:\n\n- _Reproducible._ Include steps to reproduce the problem.\n- _Specific._ Include as much detail as possible: which version, what environment, etc.\n- _Unique._ Do not duplicate existing opened issues.\n- _Scoped to a Single Bug._ One bug per report.\n\nPlease adhere to this project's [code of conduct](CODE_OF_CONDUCT.md).\n\n## Support\n\nReach out to the maintainer at one of the following places:\n\n- [GitHub discussions](https://github.com/armoniacore/armonia-vite/discussions)\n- [Discord](https://discord.gg/GQT7mrXgvc)\n\n## License\n\nThis project is licensed under the **MIT license**.\n\nSee [LICENSE](LICENSE) for more information.\n\n---\n\n\u003e [docs](https://vite.armoniacore.com/) \u0026nbsp;\u0026middot;\u0026nbsp;\n\u003e GitHub [Nucleo Armonico](https://github.com/armoniacore) \u0026nbsp;\u0026middot;\u0026nbsp;\n\u003e [Discord](https://discord.gg/GQT7mrXgvc)\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Farmoniacore%2Farmonia-vite","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Farmoniacore%2Farmonia-vite","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Farmoniacore%2Farmonia-vite/lists"}