Exporting HTML

This feature allows you to get the HTML format of the document, making it convenient to view in other places, you can also export documents directly as HTML format documents.

Exported files can be used independently of Umo Editor, meaning you can open or embed the exported HTML documents directly in the browser or other HTML pages, with styles consistent with the editor.

When exporting HTML documents, you can also inject custom CSS styles and JS scripts.

Export Effect Preview

Default Configuration

const defaultOptions = {
  // Document export related configuration
  toolbar: {
    disableMenuItems: ['exportHTML'], // Disable export HTML functionality in the toolbar
  },
  export: {
    styleURL: '',
  },
}

Configuration Description

export

• export.styleURL

Description：The URL of the style file when exporting documents, the style file defines the styles used when exporting documents, usually after running npm run build, the style is dist/style.css, you can configure the style file URL to styleURL, of course you can also place the style file in other locations, then configure this item to the correct URL path.

Note: This item must be configured, otherwise it will not be exported. And styleURL cannot be a relative path or absolute path, must be a complete URL, otherwise it may cause the style to fail to load in other places, resulting in the document not being displayed correctly.

Type：String

Default Value：''

Example：

export: {
  styleURL: `${window.location.origin}/css/umo-editor-next.css`,
}

Method List

exportHTML

Description：Export HTML format document.

Parameters：{ externalCSS, injectCSS, externalJS, injectJS, withWrapper, showBreakMarks, download, filename }

• externalCSS：Array，External CSS file URL path array, must be a complete URL, default value is [].
• injectCSS：Array，Inline CSS styles array, default value is [].
• externalJS：Array，External JS file URL path array, must be a complete URL, default value is [].
• injectJS：Array，Inline JS scripts array, default value is [].
• withWrapper：Boolean，Whether to include outer container, i.e. whether to include page background elements, default value is true.
• showBreakMarks：Boolean，Whether to display line break marks, default value is true.
• download：Boolean，Whether to download, default value is false.
• filename：String，Download file name, without file extension, default uses document name.

Return Value：string | undefined，When download is false, returns the exported HTML string, when download is true, returns undefined.