Luigi's newest feature, Luigi Container, has recently had its first release. You can find more details about it in this blog post.

Luigi Container

Luigi Container recently had its v1.0 release. This is Luigi's newest feature which aims to make micro frontend development even easier. It is a web component that can be used to render a Luigi micro frontend without the need of a Luigi Core application. It can work with any framework that supports HTML. The Luigi Compound Container can be used to include multiple micro frontends on the same page.

Installation

Luigi Container can be installed via an npm package:

npm install @luigi-project/container
          

To import it into your project, use:

import '@luigi-project/container';
          

Usage

After importing the package, you can use the Luigi Container anywhere in your application. You can configure it just like a regular Luigi application, for example by using parameters such as viewURL (which specifies the URL of the micro frontend):

    <luigi-container 
                  viewURL="https://www.example-microfronted.com" 
                  webcomponent="false" 
                  label="my label"
                  context='{"label": "Calendar"}'>
              </luigi-container>
          

The Luigi Compound Container works similarly to Luigi's compound web components feature and it allows you to insert multiple micro frontends on the same page:

    <luigi-compound-container 
                  context='{"label": "Dashboard"}'
                  compoundConfig = { your config here }>
              </luigi-compound-container>
          

Examples

You can find a Luigi Container test application on GitHub. Check out the documentation for installation instructions.

You can also take a look at our Luigi Container UI5 tutorial which shows you how to install and use Luigi Container inside an UI5 app.