[![Build Status](https://travis-ci.com/capsulajs/capsulahub.svg?branch=develop)](https://travis-ci.com/capsulajs/capsulahub)
Last updated a year ago by capsulajsci .
MIT · Repository · Bugs · Original npm · Tarball · package.json
$ cnpm install @capsulajs/capsula-hub 
SYNC missed versions from official npm registry.

Build Status

Capsula Hub


An awesome tool to develop and test your micro-frontend services !


In your project, run $ npm install --save-dev @capsulajs/capsula-hub or $ yarn add -D @capsulajs/capsula-hub. If you want to use capsula-hub command directly, you can install it globally.


capsula-hub run [options]

  -l, --local <path-to-file>  Run with local configuration file
  -p, --port <port>           Run on specified port (default 55555)


The configuration should be a js file that exports an object which match this API.

Example: config.js

module.exports = {
  name: 'my-app',
  services: [
      serviceName: 'myServiceA',
      path: 'https://my-cdn/my-service-a',
      definition: {
        serviceName: 'myServiceA',
        methods: {
          myMethod1: { asyncModel: 'RequestResponse' },
          myMethod2$: { asyncModel: 'RequestStream' },
      config: {}
      serviceName: 'myServiceB',
      path: 'https://my-cdn/my-service-b',
      definition: {
        serviceName: 'myServiceB',
        methods: {
          myMethod1: { asyncModel: 'RequestResponse' },
          myMethod2: { asyncModel: 'RequestResponse' },
      config: {}
  components: {
    layouts: {
      grid: {
        componentName: 'my-grid',
        path: 'http://my-cdn/components/Grid.js',
        config: { title: 'Base Grid' },
    items: {
      myItem: {
        componentName: 'my-item',
        path: 'http://my-cdn/components/myItem.js',
        config: { title: 'Base Item' },

Develop your extension

An extension is a service or a web component that is loaded by CapsulaHub. The extension should look like this:

import { Workspace } from '@capsulajs/capsulahub-core-workspace';
export default (workspace: Workspace, config: object): Promise<void> => {
  // your code here

workspace and config are injected by the application in the extension.

workspace is matching this API and could be use in particular to allow the service to register itself.

config contains the configuration for this specific extension that you passed in the configuration file (e.g: configuration_file.services.['myExtension'].config for myExtension service).

For more details, take a look at this example file.

<!-- To put back later for local dev Run it locally

What to do Command
To run the linter: yarn lint
To run the tests: yarn test
To generate the doc: yarn doc


  • Clone the project then do yarn or npm i
  • Create a capsulahub.json file at the root with the following structure:
      "token": "your_token"
  • Run yarn start or npm run start. -->


CapsulaHub is released under MIT License.

Current Tags

  • 0.0.9                                ...           latest (a year ago)
  • 0.0.8-feature-update-ws-1560438547                                ...           snapshot (a year ago)

54 Versions

Today 0
This Week 0
This Month 54
Last Day 0
Last Week 54
Last Month 0
Dependencies (11)
Dev Dependencies (13)
Dependents (0)

Copyright 2014 - 2017 © taobao.org |