Bundling TinyMCE icon packs using module loading

Overview

This section shows the files required for each TinyMCE component. The file paths shown are relative to the root TinyMCE package directory, where tinymce.min.js is stored. For example:

./
├── icons/
├── jquery.tinymce.min.js
├── langs/
├── license.txt
├── plugins/
├── readme.txt
├── skins/
├── themes/
├── tinymce.d.ts
├── tinymce.js
├── tinymce.min.js
└── version.txt

The following table shows examples of the syntax used to bundle the following icon pack:

./icons/example/icons.js

Example syntax for including the example icon pack in a bundle:

Module Syntax Source Example

Module Syntax	Source	Example
ES6+	npm	`import 'tinymce/icons/example';`
`.zip`	`import '../tinymce/icons/example/icons';`
Common JS	npm	`require('tinymce/icons/example');`
`.zip`	`require('../tinymce/icons/example/icons.js');`

ES6+

npm

import 'tinymce/icons/example';

.zip

import '../tinymce/icons/example/icons';

Common JS

npm

require('tinymce/icons/example');

.zip

require('../tinymce/icons/example/icons.js');

Community

Default icons

./icons/default/icons.js

Premium

For information on premium icon packs, see: Tiny Skins and Icon Packs.

Bootstrap icons

./icons/bootstrap/icons.js

Jam icons

./icons/jam/icons.js

Material icons

./icons/material/icons.js

Small icons

./icons/small/icons.js

Thin icons

./icons/thin/icons.js