阿里云微前端解决方案.zip

# Alfa <!-- ALL-CONTRIBUTORS-BADGE:START - Do not remove or modify this section --> [](#contributors-) <!-- ALL-CONTRIBUTORS-BADGE:END --> [![NPM version][npm-image]][npm-url] [npm-image]: https://img.shields.io/npm/v/@alicloud/console-os-kernal.svg?style=flat-square [npm-url]: https://npmjs.org/package/@alicloud/console-os-kernal <p align="center"> <a href="https://www.alibabacloud.com"> <img src="https://aliyunsdk-pages.alicdn.com/icons/AlibabaCloud.svg"> </a> <a href="https://aliyun.github.io/alibabacloud-alfa/"> <img src="https://gw.alicdn.com/tfs/TB1pJiNh_M11u4jSZPxXXahcXXa-160-160.png"> </a> </p> ## 介绍 `Alfa` 是在阿里云控制台体系中孵化🐣的微前端方案， 定位是面向企业级的微前端体系化解决方案。 ## 特性 * 📦 开箱即用，无代码侵入 * 📎 完善的微前端体系支撑 * 🕋 完整前端容器沙箱 * ♋️ 多实例兼容 ## 使用文档 参见： [https://aliyun.github.io/alibabacloud-alfa](https://aliyun.github.io/alibabacloud-alfa) ## Try Example 克隆仓库到本地 ``` git clone https://github.com/aliyun/alibabacloud-alfa.git ``` 安装子应用 ```bash $ npm run install:example ``` 运行 React 子应用 ```bash $ cd example/SubApp/React $ npm run start # you will visit app on http://localhost:8080/ ``` 运行 Vue 子应用 ```bash $ cd example/SubApp/Vue $ npm run serve # you will visit app on http://localhost:8081/ ``` 运行 宿主 应用 ```bash $ cd example/HostApp/ReactHost $ npm run start # you will visit app on http://localhost:3000/ ``` 你可以在 http://localhost:3000/ 访问到当前加载的两个子应用。 ## Try Live Demo ### React * [基础用法](https://codesandbox.io/s/jolly-sun-pf75y) * [React 加载 Angular 应用](https://codesandbox.io/s/busy-jepsen-xp8q9) ### Angular * [Angular 加载 React 应用](https://codesandbox.io/s/nameless-rain-1yv57) ### Vue * [Vue 加载微应用](https://codesandbox.io/s/cool-grass-lbrfn?file=/src/components/HelloWorld.vue) ## 贡献指南 参见[贡献指南](https://github.com/aliyun/alibabacloud-console-toolkit/blob/master/CONTRIBUTING.md) ## Contributors ✨ Thanks goes to these wonderful people ([emoji key](https://allcontributors.org/docs/en/emoji-key)): <!-- ALL-CONTRIBUTORS-LIST:START - Do not remove or modify this section --> <!-- prettier-ignore-start --> <!-- markdownlint-disable --> <table> <tr> <td align="center"><a href="https://github.com/Boelroy"><img src="https://avatars0.githubusercontent.com/u/2794349?v=4?s=100" width="100px;" alt=""/><br />_<b>Bowen</b></a><br /><a href="https://github.com/aliyun/alibabacloud-alfa/commits?author=Boelroy" title="Code">💻</a> <a href="https://github.com/aliyun/alibabacloud-alfa/commits?author=Boelroy" title="Documentation">📖</a></td> <td align="center"><a href="https://github.com/royIdoodle"><img src="https://avatars3.githubusercontent.com/u/17637852?v=4?s=100" width="100px;" alt=""/><br />_{<b>Roy.idoodle</b>}</a><br /><a href="https://github.com/aliyun/alibabacloud-alfa/commits?author=royIdoodle" title="Code">💻</a> <a href="https://github.com/aliyun/alibabacloud-alfa/commits?author=royIdoodle" title="Documentation">📖</a></td> <td align="center"><a href="https://segmentfault.com/u/csryan"><img src="https://avatars2.githubusercontent.com/u/18747423?v=4?s=100" width="100px;" alt=""/><br />_{<b>csr632</b>}</a><br /><a href="https://github.com/aliyun/alibabacloud-alfa/commits?author=csr632" title="Code">💻</a></td> <td align="center"><a href="https://github.com/digu"><img src="https://avatars2.githubusercontent.com/u/44129641?v=4?s=100" width="100px;" alt=""/><br />_<b>Digu</b></a><br /><a href="https://github.com/aliyun/alibabacloud-alfa/commits?author=digu" title="Code">💻</a></td> <td align="center"><a href="https://www.yuque.com/seekhow/blog"><img src="https://avatars2.githubusercontent.com/u/31029342?v=4?s=100" width="100px;" alt=""/><br />_{<b>QiuHao</b>}</a><br /><a href="https://github.com/aliyun/alibabacloud-alfa/issues?q=author%3Aseekhow" title="Bug reports">🐛</a></td> <td align="center"><a href="https://fromyb.com/"><img src="https://avatars1.githubusercontent.com/u/11918866?v=4?s=100" width="100px;" alt=""/><br />_{<b>道玄</b>}</a><br /><a href="https://github.com/aliyun/alibabacloud-alfa/commits?author=yozman" title="Documentation">📖</a></td> </tr> </table> <!-- markdownlint-restore --> <!-- prettier-ignore-end --> <!-- ALL-CONTRIBUTORS-LIST:END --> <!-- ALL-CONTRIBUTORS-LIST:START - Do not remove or modify this section --> <!-- prettier-ignore-start --> <!-- markdownlint-disable --> <!-- markdownlint-restore --> <!-- prettier-ignore-end --> <!-- ALL-CONTRIBUTORS-LIST:END --> This project follows the [all-contributors](https://github.com/all-contributors/all-contributors) specification. Contributions of any kind welcome!