{"id":21465749,"url":"https://github.com/jsaaron/qiankun-vue-react-html-demo","last_synced_at":"2026-01-27T01:34:23.322Z","repository":{"id":76910448,"uuid":"531093305","full_name":"JsAaron/qiankun-vue-react-html-demo","owner":"JsAaron","description":null,"archived":false,"fork":false,"pushed_at":"2022-08-31T13:22:42.000Z","size":130,"stargazers_count":0,"open_issues_count":0,"forks_count":1,"subscribers_count":2,"default_branch":"main","last_synced_at":"2025-06-04T00:59:30.616Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":null,"language":"Vue","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/JsAaron.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"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":"2022-08-31T13:18:31.000Z","updated_at":"2022-08-31T13:22:45.000Z","dependencies_parsed_at":"2023-02-27T04:15:39.055Z","dependency_job_id":null,"html_url":"https://github.com/JsAaron/qiankun-vue-react-html-demo","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"purl":"pkg:github/JsAaron/qiankun-vue-react-html-demo","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/JsAaron%2Fqiankun-vue-react-html-demo","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/JsAaron%2Fqiankun-vue-react-html-demo/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/JsAaron%2Fqiankun-vue-react-html-demo/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/JsAaron%2Fqiankun-vue-react-html-demo/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/JsAaron","download_url":"https://codeload.github.com/JsAaron/qiankun-vue-react-html-demo/tar.gz/refs/heads/main","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/JsAaron%2Fqiankun-vue-react-html-demo/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":286080680,"owners_count":28795468,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2026-01-27T01:07:07.743Z","status":"ssl_error","status_checked_at":"2026-01-27T01:07:06.974Z","response_time":59,"last_error":"SSL_read: unexpected eof while reading","robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":false,"can_crawl_api":true,"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-11-23T08:11:52.640Z","updated_at":"2026-01-27T01:34:23.292Z","avatar_url":"https://github.com/JsAaron.png","language":"Vue","funding_links":[],"categories":[],"sub_categories":[],"readme":"# 项目说明 qiankun-vue-demo\n\n用`qiankun`来实现`vue`技术栈的前端微服务\n\n`main`是主项目，`app-vue-hash`是`hash`模式路由的子项目，`app-vue-history`是`history`模式路由的子项目\n\n`qiankun`的开发和打包和正常模式一模一样，它使用一个全局变量`__POWERED_BY_QIANKUN__`来区分微前端模式和正常模式，不需要额外的配置和代码。\n\n具体的原理分析和介绍可以看：[qiankun 微前端方案实践及总结](https://juejin.im/post/6844904185910018062) 和 [qiankun 微前端实践总结（二）](https://juejin.im/post/6856569463950639117)\n\n## 运行和打包\n\n在根目录下：\n\n先安装依赖： `npm install`，再执行`npm run install-all`为所有项目安装依赖，最后执行`npm run start-all`即可启动所有的项目。\n\n`npm run build-all`可以打包所有`vue`项目，`jQuery`项目不需要打包。\n\n\n## 分支介绍\n\n- `master` 分支： `qiankun` 的常规基础用法\n- `feature/hash-router` 分支 ：主子项目都是 `hash` 模式\n- `feature/keep-alive` 分支 ：使用 `loadMicroApp` 来实现 `keep-alive` 的 `tab` 效果\n- `feature/share-component` 分支 ：项目间共享组件的例子\n- `feature/routing-page` 分支 ：在主项目的某个路由页面加载子应用\n- `feature/share-dependencies` 分支 ：子项目复用主项目的公共依赖（vue，vuex，vue-router），以及主子项目间 i18n 的处理\n- `feature/vite-child` 分支 ：子项目是 vite 构建的 vue3 项目\n- `feature/use-main-app-component` 分支 ：子项目复用主项目的依赖\n- `feature/abstract-route` 分支 ：主项目同时展示两个子应用的不同页面，子项目使用 abstract 路由\n- `develop` 分支 ：修改源码来实现 `keep-alive`，以及公共依赖的复用的例子","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fjsaaron%2Fqiankun-vue-react-html-demo","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fjsaaron%2Fqiankun-vue-react-html-demo","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fjsaaron%2Fqiankun-vue-react-html-demo/lists"}