laurent22/joplin · error · Error

Non-css assets are not supported by the CodeMirror 6 editor.

Error message

Non-css assets are not supported by the CodeMirror 6 editor. (Asset path: ${asset.name})

What it means

Thrown for a non-inline asset whose name does not end in '.css' and whose mime is not 'text/css'. The CodeMirror 6 editor plugin API only supports CSS assets; non-CSS assets (images, fonts, JS) cannot be injected because the loader only builds <style> elements via addStyles. The asset.name in the message identifies the offending file.

Source

Thrown at packages/editor/CodeMirror/pluginApi/PluginLoader.ts:169

			if (loadedPlugin.codeMirrorOptions) {
				for (const key in loadedPlugin.codeMirrorOptions) {
					this.editor.setOption(key, loadedPlugin.codeMirrorOptions[key]);
				}
			}

			if (loadedPlugin.assets) {
				const cssStrings = [];

				for (const asset of loadedPlugin.assets()) {
					let assetText: string = asset.text;
					let assetMime: string = asset.mime;

					if (!asset.inline) {
						if (!asset.name) {
							throw new Error('Non-inline asset missing required property "name"');
						}
						if (assetMime !== 'text/css' && !asset.name.endsWith('.css')) {
							throw new Error(
								`Non-css assets are not supported by the CodeMirror 6 editor. (Asset path: ${asset.name})`,
							);
						}

						assetText = await plugin.loadCssAsset(asset.name);
						assetMime = 'text/css';
					}

					if (assetMime !== 'text/css') {
						throw new Error(
							'Plugin assets must have property "mime" set to "text/css" or have a filename ending with ".css"',
						);
					}

					cssStrings.push(assetText);
				}

				addStyles(cssStrings);

View on GitHub (pinned to 2654b33620)

Solutions

1. Remove non-CSS assets from the assets() return — embed images/fonts via CSS (data URIs) or bundle them in the plugin's main JS instead.
2. If the asset is genuinely CSS, rename the file to end in .css or set asset.mime = 'text/css'.
3. For inline CSS, switch to inline: true with text containing the styles.

Example fix

// before
assets: () => [{ name: 'theme.json', mime: 'application/json', text: '{}' }],
// after — only CSS is supported
assets: () => [{ inline: true, mime: 'text/css', text: '.cm-editor { color: red }' }],

function assertCssAsset(a) {
  const isCss = a.mime === 'text/css' || (typeof a.name === 'string' && a.name.endsWith('.css'));
  if (!a.inline && !isCss) throw new Error(`Non-CSS asset not supported: ${a.name}`);
}
assets().forEach(assertCssAsset);

function isCssAsset(a) {
  return a.mime === 'text/css' || (typeof a.name === 'string' && a.name.endsWith('.css'));
}

try {
  loader.setPlugins(contentScripts);
} catch (e) {
  if (/Non-css assets are not supported/.test(e.message)) {
    // strip the offending asset, notify author
  } else throw e;
}

When it happens

Trigger: A plugin declares an asset like { name: 'icon.png', mime: 'image/png' }; asset.name is 'theme.js'; the name has no extension and mime is absent/wrong; a CM5 plugin ported with image/font assets that CM6 cannot consume.

Common situations: Plugin author bundled an icon or font as a non-inline asset; the asset name was mistyped without the .css extension; the mime field was omitted and name doesn't end with .css.

Related errors

• Non-inline asset missing required property "name"
• Plugin assets must have property "mime" set to "text/css" or
• All plugins must have a function default export
• Cannot find library ${library}
• No text editor is defined. Please set it using `config edito

AI-assisted analysis of laurent22/joplin@2654b33620 (2026-08-12). Data as JSON: /api/errors/9ff7166231f82961. Report an issue: GitHub.