This repository is deprecated!
The renderer has now been moved back to the official Joplin repository, to make development easier:
https://github.com/laurent22/joplin/tree/master/ReactNativeClient/lib/joplin-renderer
The renderer is still self-contained though, and can be used separately outside of the Joplin applications.
This is the renderer used by Joplin to render notes in Markdown or HTML format.
npm i -s joplin-renderer
Certain plugins require additional assets like CSS, fonts, etc. These assets are in the /assets directory and should be copied to wherever the application can find them at runtime.
const { MarkupToHtml } = require('joplin-renderer');
const options = {};
// The notes are rendered using the provided theme. The supported theme properties are in `defaultNoteStyle.js`
// and this is what is used if no theme is provided. A `theme` object can be provided to override default theme
// properties.
const theme = {};
const markdown = "Testing `MarkupToHtml` renderer";
const markupToHtml = new MarkupToHtml(options);
const result = await markupToHtml.render(MarkupToHtml.MARKUP_LANGUAGE_MARKDOWN, markdown, theme, options);
console.info('HTML:', result.html);
console.info('Plugin assets:', result.pluginAssets);When calling render(), an object with the following properties is returned:
html: The rendered HTML codepluginAssets: The assets required by the plugins
The assets need to be loaded by the calling application. For example this is how they are loaded in the Joplin desktop application:
function loadPluginAssets(assets) {
for (let i = 0; i < assets.length; i++) {
const asset = assets[i];
if (asset.mime === 'text/css') {
const link = document.createElement('link');
link.rel = 'stylesheet';
link.href = 'pluginAssets/' + asset.name;
document.getElementById('joplin-container-styleContainer').appendChild(link);
}
}
}