Renders Mule XML files as HTML.
Last updated 3 months ago by noxharmonium .
Apache-2.0 · Repository · Bugs · Original npm · Tarball · package.json
$ cnpm install @agiledigital/mule-preview 
SYNC missed versions from official npm registry.

Mule Preview

GitHub License Known Vulnerabilities npm (scoped) FOSSA Status semantic-release


This is the core module of the Mule Preview project.

It is a self contained bundle that can be included in other projects to render Mule XML files in a browser context using React.

See the Mule Preview Browser Extension for example usage.


The module exposes four components that can be imported and used in a React project:

  • <MulePreviewDiffUrl contentUrls={["https://a.xml", "https://b.xml"] contentRoot="."} />
  • <MulePreviewDiffContent contentStrings={["<mule></mule>", "<mule></mule>"] contentRoot="."} />
  • <MulePreviewUrl contentUrl="https://a.xml" contentRoot="."} />
  • <MulePreviewContent contentString="<mule></mule>" contentRoot="."} />


  • contentUrls is a tuple of two URLs to be diffed

  • contentStrings is a tuple of two strings with XML content to be diffed

  • contentUrl is a URL to be rendered as a preview

  • contentString is a string with XML to be rendered as a preview

  • contentRoot is the a prefix to prepend to any requests for the Mule component image files.

      import React from "react";
      import ReactDOM from "react-dom";
      import {
      } from "mule-preview";
            contentUrls={["https://example.com/muleA.xml", "https://example.com/muleB.xml"]}


On a fresh checkout of the codebase you will need to extract the mappings and icon assets from Anypoint Studio using mule-metadata-extractor.

Download the latest release of mule-metadata-extractor and run the following commands:

java -jar mule-metadata-extractor-1.0.14-standalone.jar -d "${ANYPOINT_STUDIO_INSTALLATION}" -o public/ generate-mappings
java -jar mule-metadata-extractor-1.0.14-standalone.jar -d "${ANYPOINT_STUDIO_INSTALLATION}" -o public/img/icons extract-images
java -jar mule-metadata-extractor-1.0.14-standalone.jar-d "${ANYPOINT_STUDIO_INSTALLATION}" -o public/img/icons apply-light-theme

At some point we may provide pre-extracted bundles that can be used with Mule Preview. We are still unsure about the licencing conditions around bundling and redistributing Mulesoft assets. We are waiting for a response from Mulesoft. In the meantime feel free to extract the files yourself for personal use.


To work on this module, the following command will mount Mule Preview in a test environment with hot reloading.

$ npm start

Simply navigate to http://localhost:8080 in a browser to view the test environment


Simply run these command to produce a production build

$ npm run build

The release files will be placed in the "dist" folder


Math icons made by Freepik from www.flaticon.com


FOSSA Status

Current Tags

  • 2.2.4                                ...           latest (3 months ago)

14 Versions

  • 2.2.4                                ...           3 months ago
  • 2.2.3                                ...           4 months ago
  • 2.2.2                                ...           5 months ago
  • 2.2.1                                ...           6 months ago
  • 2.2.0                                ...           6 months ago
  • 2.1.1                                ...           8 months ago
  • 2.1.0                                ...           8 months ago
  • 2.0.1                                ...           8 months ago
  • 2.0.0                                ...           8 months ago
  • 1.0.18                                ...           8 months ago
  • 1.0.17                                ...           8 months ago
  • 1.0.16                                ...           9 months ago
  • 1.0.15                                ...           9 months ago
  • 1.0.13                                ...           9 months ago
Today 0
This Week 0
This Month 0
Last Day 0
Last Week 14
Last Month 42
Dependencies (5)
Dependents (0)

Copyright 2014 - 2016 © taobao.org |