Skip to main content

快速起步

介绍#

icestark 是一个面向大型系统的微前端解决方案，适用于以下业务场景：

  • 后台比较分散，体验差别大，因为要频繁跳转导致操作效率低，希望能统一收口的一个系统内
  • 单页面应用非常庞大，多人协作成本高，开发/构建时间长，依赖升级回归成本高
  • 系统有二方/三方接入的需求

icestark 在保证一个系统的操作体验基础上，实现各个微应用的独立开发和发版，主应用通过 icestark 管理微应用的注册和渲染，将整个系统彻底解耦。

项目初始化#

icestark 可以通过简单的命令行，生成主应用和微应用模板。无论您是使用 React 还是 Vue，都可以便捷的创建符合 icestark 微前端规范的项目。这些项目均由 icestark 团队官方维护。

tip

如果您想将正在开发中或已开发完成的项目接入 icestark，请移步 主应用接入 和 微应用接入。如果您使用的是 create-react-app 、umi 等框架开发的应用，亦可参考 其他框架的接入指南。

初始化主应用#

# 基于 React 的主应用
$ npm init ice icestark-layout @icedesign/stark-layout-scaffold
# 或者基于 Vue 的主应用
$ npm init ice icestark-layout @vue-materials/icestark-layout-app
$ cd icestark-layout
$ npm install
$ npm start

初始化微应用#

# 基于 React 的微应用
$ npm init ice icestark-child @icedesign/stark-child-scaffold
# 基于 Vue 的微应用
$ npm init ice icestark-child @vue-materials/icestark-child-app
$ cd icestark-child
$ npm install
$ npm run start

兼容性#

  • 现代浏览器和 IE11。
tip

对于 IE 系列浏览器，需要提供相应的 polyfill 支持。详细介绍，请参考 常见问题 -> 兼容 IE 浏览器

Edit this page