JSPM

@microzord/webpack-plugin

0.1.0-alpha.6
  • ESM via JSPM
  • ES Module Entrypoint
  • Export Map
  • Keywords
  • License
  • Repository URL
  • TypeScript Types
  • README
  • Created
  • Published
  • Downloads 1
  • Score
    100M100P100Q15532F
  • License Apache-2.0

Package Exports

  • @microzord/webpack-plugin

This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (@microzord/webpack-plugin) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.

Readme

microzord logo microzord

Attention: WIP

It is a pre-alpha version of the library. Please, do not use it until official release.

npm version npm bundle size

What is it?

It is a small tool that allows you to add and render multiple apps on one page. It has simple ideomatic APIs for all modern frameworks and builds bridges between them.

🧙 Framework agnostic. You can have an Angular application with a React app header and a Vue app footer. Each app can have endless amount of nested apps inside. There are also wrappers for every modern framework with simple API.

🧩 Modular. You can insert another app in your app in any place as an ordinary component. Use the same methods to bind data and to handle its events.

🐝 Tiny as a bee and works as well. No new code in the bundle of child application and a bit more than 1 KB library for host application to get all the benefits!

Installation and usage

An extensive demo is coming soon...

An example of usage external apps in Angular app

app.module.ts

@NgModule({
  imports: [
    MicrozordHostModule.register({
      apps: [
        {
          name: 'react-menu',
          assetMap: '/react-menu/microzord.json',
        },
        {
          name: 'vue-footer-app',
          assetMap: '/vue-footer-app/microzord.json',
        },
      ],
    }),
  ],
})
export class AppModule {}

Usage in application:

<header microzord="react-menu"></header>

<div>Any content</div>

<footer microzord="vue-footer-app" (hook)="onFooterLifecycleEvent($event)"></footer>

Core team

Igor Katsuba
Igor Katsuba
Roman Sedov
Roman Sedov

License

🆓 Feel free to use our library in your commercial and private applications

All microzord packages are covered by Apache 2.0

Read more about this license here