Extension:CodeMirror

**Příručka k rozšířením MediaWiki**
CodeMirror; Stav rozšíření: stabilní
Implementace	Uživatelské rozhraní
Popis	Poskytuje zvýrazňování syntaxe v editorech
Autoři	Pavel Astakhov; MusikAnimal; Bhsd;
Správci	Community Tech
Nejnovější verze	6.0.0
Zásady kompatibility	Vydání snímků současně s MediaWiki. Hlavní vývojová větev není zpětně kompatibilní.
PHP	8.2+
	Parametry $wgCodeMirrorDefaultPreferencesCode; $wgCodeMirrorVisualEditorCustomHighlight; $wgCodeMirrorConflictingGadgets; $wgCodeMirrorEnabledModes; $wgCodeMirrorDefaultPreferences; $wgCodeMirrorPrimaryPreferences;
	Použité háčky (hooks) EditPage::showEditForm:initial; EditPage::showReadOnlyForm:initial; GetPreferences; SpecialPageAfterExecute; UploadForm:initial;
Licence	GNU General Public License 2.0 nebo novější
Stáhnout	Stáhněte si rozšíření ; Git [?]: Procházení úložiště (Phabricator · GitHub); Kontrola kódu Gerrit; Zobrazení historie Git; Stáhněte si zdrojový soubor tarball; ; README
Nápověda	Help:Extension:CodeMirror/cs
	Přeložte rozšíření CodeMirror, používá-li lokalizaci z translatewiki.net
Problémy	Otevřené úkoly · Nahlásit chybu

This page is a translated version of the page Extension:CodeMirror and the translation is 100% complete.

Nesmí se zaměňovat s CodeEditor .

Rozšíření CodeMirror poskytuje samostatný editor se zvýrazňováním syntaxe pro řadu programovacích a značkovacích jazyků, včetně wikitextu, s využitím knihovny CodeMirror. Lze jej použít s dalšími editory, jako například WikiEditor , Editor wikitextu 2017 , Proofread Page a dalšími. Použití a seznam funkcí naleznete v části Nápověda:Rozšíření:CodeMirror .

V letech 2024–2025 bylo rozšíření upgradováno na novou hlavní verzi CodeMirror 6 a s ní bylo přidáno mnoho nových funkcí .

Informace o starší verzi naleznete v článku Extension:CodeMirror/5 .
Podrobnou dokumentaci naleznete na stránce Nápověda:Rozšíření:CodeMirror .
Dokumentaci JavaScriptu najdete na wmdoc:CodeMirror.

Instalace

Stáhněte soubor/y a vložte je do adresáře pojmenovaného CodeMirror ve vaší složce extensions/.
Vývojáři a přispěvatelé kódu by si místo toho měli nainstalovat rozšíření from Git pomocí:
```
cd extensions/
git clone https://gerrit.wikimedia.org/r/mediawiki/extensions/CodeMirror
```
Na konec vašeho souboru LocalSettings.php přidejte následující kód:
```
wfLoadExtension( 'CodeMirror' );
```
Vyžaduje nastavení v konfiguračním souboru.
Dokončeno – Přejděte na stránku Special:Version vaší wiki a zkontrolujte, zda bylo rozšíření úspěšně nainstalováno.

Konfigurace

Chcete-li CodeMirror ve výchozím nastavení povolit pro všechny uživatele, přidejte do souboru LocalSettings.php následující:

LocalSettings.php

# Ve výchozím nastavení povoluje používání CodeMirror, ale stále umožňuje uživatelům jej zakázat.
$wgDefaultUserOptions[ 'usecodemirror' ] = true;

Pokud se pro úpravu kódu používá CodeMirror místo CodeEditoru, má vliv druhá uživatelská volba usecodemirror-code, která je ve výchozím nastavení nastavena na true.

$wgCodeMirrorEnabledModes: Dočasný příznak funkce pro řízení konfliktů s Extension:CodeEditor . Více informací naleznete v sekci Použití CodeMirroru místo CodeEditoru níže.
$wgCodeMirrorConflictingGadgets: Pole názvů gadgetů, které, pokud jsou povoleny, zabrání načtení CodeMirror. Výchozí hodnota je wikEd.
$wgCodeMirrorPrimaryPreferences: Předvolby , které se mají zobrazovat v panelu předvoleb v editoru. Měly by mít jasný vizuální efekt nebo být běžně používané pro snazší přístup k přepínání funkce. Předvolby, které zde nejsou uvedeny, budou i nadále dostupné v dialogovém okně s kompletními předvolbami.
$wgCodeMirrorDefaultPreferences: Určuje, které funkce jsou ve výchozím nastavení povoleny pro všechny uživatele. Více informací naleznete níže.
$wgCodeMirrorDefaultPreferencesCode: Stejné jako $wgCodeMirrorDefaultPreferences, ale platí pro "code". Tedy pro jakýkoli režim CodeMirror jiný než "mediawiki" (wikitext).

Výchozí předvolby

Výchozí preference jsou nastaveny buď na wikitext ($wgCodeMirrorDefaultPreferences), nebo na všechny ostatní "režimy", jako je JavaScript, CSS a JSON ($wgCodeMirrorDefaultPreferencesCode). Pro každou funkci použijte true nebo false k jejímu úplnému povolení nebo zákazu, případně zadejte pole obsahující ID jmenných prostorů (celá čísla) označující, kde by měla být funkce ve výchozím nastavení povolena.

Toto nastavení konfigurace platí pouze pro výchozí hodnotu. Uživatelé mohou přepsat výchozí hodnoty ve svých vlastních předvolbách CodeMirror. Změna preference se vztahuje pouze na wikitext (režim mediawiki) nebo na newikitext (všechny ostatní režimy).

Například:

LocalSettings.php

# Omezit zvýrazňování mezer na text mimo wikitext
$wgCodeMirrorDefaultPreferences[ 'whitespace' ] = false;
$wgCodeMirrorDefaultPreferencesCode[ 'whitespace' ] = true;

# Omezení automatického doplňování na šablony a kód
$wgCodeMirrorDefaultPreferences[ 'autocomplete' ] = [ NS_TEMPLATE ];
$wgCodeMirrorDefaultPreferencesCode[ 'autocomplete' ] = true;

`$wgCodeMirrorDefaultPreferences`
Funkce	editor 2017 kompatibilita	Výchozí hodnota	Výchozí hodnota (code)^[1]
`activeLine`	N	`false`	`true`
`autocomplete`	N	`true`	`true`
`autofocus`	^[2]	`true`	`true`
`bidiIsolation`^[3]	N	`false`	`false`
`bracketMatching`		`true`	`true`
`closeBrackets`	N	`false`	`true`
`closeTags`^[4]	N	`false`	`false`
`codeFolding`	N	`true`	`true`
`foldAllRefs` ^[5]	N	`false`	N/A
`highlightRefs` ^[6]		`true`	N/A
`lineNumbering`		`true`	`true`
`lineWrapping`	^[7]	`true`	`true`
`lint`	N	`false`	`true`
`openLinks`	N	`true`	`true`
`specialChars`	N	`true`	`true`
`trailingWhitespace`	N	`false`	`false`
`whitespace`	N	`false`	`false`

Rozdíly oproti CodeMirror 5

Nové možnosti

Již není nutné použít WikiEditor .
Podpora pro Scribunto, JavaScript, CSS, JSON a Vue jako alternativa k CodeEditor .
Významné zlepšení výkonu.
Podpora zprava doleva (T170001) s izolací bidi. (T358804)
Skládání kódu . (T30684)
Automatické doplňování . (T95100)
Linting . (T381577)
Rychlé otevření odkazů pomocí modifikační klávesy + kliknutí . (T303392)
Vylepšený vyhledávací panel. (T371436)
Předvolby CodeMirroru . (T359498)
Zvýrazňování syntaxe v Nástroje pro diskuzi . (T407918)
Zvýrazňování syntaxe na stránkách pouze pro čtení. (T301615)
Zvýrazňování syntaxe na Special:Upload. (T170246)
Zvýrazňování syntaxe na Special:ExpandTemplates. (T384148)
Zvýrazňování syntaxe na Special:AbuseFilter. (T399673)
Zvýrazňování syntaxe na Special:SecurePoll/translate (T397871)
Robustní JavaScript API pro integraci s rozšířeními, gadgety a uživatelskými skripty.

Zastaralé verze a další změny

Moduly ResourceLoader se změnily. Viz průvodce migrací.
Háček ext.CodeMirror.switch byl zastaralý. Použijte místo něj ext.CodeMirror.toggle.
CSS třída .cm-mw-mnemonic byla přejmenována na .cm-mw-html-entity.
CSS třída .cm-mw-doubleUnderscore byla přejmenována na .cm-mw-double-underscore.
Třída .cm-mw-template-name-mnemonic byla odstraněna. Použijte místo ní třídu .cm-mw-template-ground.cm-html-entity.
CSS třídy .cm-mw-apostrophes-bold a .cm-mw-apostrophes-italic byly odstraněny. Použijte místo nich .cm-mw-apostrophes.
Stylování na úrovni řádku pro <nowiki>, <pre> nebo jakoukoli značku bez přidružené značky TagMode bylo odstraněno (T351686).
Smíšené jazyky ve wikitextu zatím nejsou podporovány (T357480).
Nativní vyhledávací funkce prohlížeče (používá Ctrl+F) byla nahrazena vyhledávací funkcí integrovanou do CodeMirror. To je nezbytné pro udržení výkonu (T303664).

Průvodce migrací

Verze MediaWiki:

≥ 1.45

Tato příručka platí pro MediaWiki 1.45 a novější. Od MediaWiki 1.46 již CodeMirror 5 není podporováno.

Konfigurace MediaWiki

$wgCodeMirrorLineNumberingNamespaces je zastaralé. Místo toho je použita konfigurace $wgCodeMirrorDefaultPreferences.

Moduly ResourceLoader

Ujistěte se, že používáte správné moduly ResourceLoader. Protože CodeMirror 6 již nespoléhá na WikiEditor, došlo k několika změnám v názvech a chování oproti protějškům CodeMirror 5:

Některé názvy modulů jsou pro stručnost zobrazeny bez předpony ext.CodeMirror. Při použití nahraďte předponu '…'.

Starý modul	Starý modul (MW 1,45)	Nový modul (MW 1.46+)	Popis
`ext.CodeMirror`	`….v6.init`	`….init`	Integrace CodeMirror pro WikiEditor na `#wpTextbox1` (normální textové pole pro úpravy).
N/A	`….v6.WikiEditor`	`….WikiEditor`	Exportuje třídu CodeMirrorWikiEditor
N/A	`….v6.init`	`….init`	CodeMirror pro `#wpTextbox1` a další podporované stránky.
`….lib`	`….v6.lib`	`….lib`	Exportuje interní prvky CodeMirror.
`….addons`	N/A	N/A	Toto zabalilo funkci porovnávání závorek v CodeMirror 5. Porovnávání závorek je výchozím chováním v CodeMirror 6.
`….mode.mediawiki`	`….v6.mode.mediawiki`	`….mode.mediawiki`	Jazykový režim MediaWiki.
N/A	`ext.CodeMirror.v6`	`ext.CodeMirror`	Exportuje třídu CodeMirror.
`….visualEditor`	`….visualEditor.init`	`….visualEditor.init`	Integrace s Editor wikitextu 2017 .
`….lib.mode.php`		N/A	CodeMirror 6 nakonec některé nebo všechny tyto režimy poskytne, ale nebudou k dispozici jako samostatné moduly.
`….lib.mode.clike`
`….lib.mode.htmlmixed`
`….lib.mode.xml`
`….lib.mode.javascript`	`….v6.modes`	`….modes`	Tyto jazyky jsou podporovány v CodeMirror 6.
`….lib.mode.css`
N/A
N/A
N/A

S vydáním MediaWiki 1.46 budou staré moduly nahrazeny novými a moduly .v6 budou zcela odstraněny.

Gadgety a uživatelské skripty

Globální limit CodeMirror byl zcela odstraněn. Například CodeMirror.fromTextArea( myTextarea ) už nebudou fungovat. Místo toho nejprve načtěte požadované moduly ResourceLoader, vytvořte instanci objektu CodeMirror a zavolejte metodu initialize().

Pokud váš skript používá háček ext.CodeMirror.switch pro změnu způsobu interakce s editorem, budete muset místo toho použít háček ext.CodeMirror.toggle nebo alternativně naslouchat události. Více informací naleznete v části Integrace JavaScriptu.

CSS

Prvek .CodeMirror již neexistuje. Pro celý DOM CodeMirror použijte místo něj .cm-editor nebo pro vnitřní obsah .cm-content (například nezahrnuje vyhledávací panel).

Viz zastaralé verze a další změny u jiných CSS tříd.

Integrace

Rozšíření MediaWiki

Používání CodeMirror místo CodeEditoru

Verze MediaWiki:

≥ 1.44

Od verze MediaWiki 1.44 podporuje CodeMirror zvýrazňování jazyků Lua, JavaScript, CSS, JSON a Vue. Lze jej použít jako alternativu k Extension:CodeEditor .

Upozorňujeme však, že ne všechna rozšíření, která se integrují s CodeEditorem, byla aktualizována pro podporu CodeMirror. Pokud používáte některé z těchto rozšíření, můžete si ponechat CodeEditor nainstalovaný na vaší wiki:

Extension:VisualEditor – používá moduly CodeEditoru k zvýrazňování syntaxe pro další rozšíření integrující se s VisualEditorem (T400014):
Extension:WikiLambda – modul ext.wikilambda.app se spoléhá na CodeEditor (T400015).

Aby to od verze MediaWiki 1.45+ fungovalo, budete muset odpovídajícím způsobem upravit $wgCodeMirrorEnabledModes a také *UseCodeEditor a *UseCodeMirror za všechna příslušná rozšíření, která jste také nainstalovali:

LocalSettings.php

// Požadované režimy, které by měly používat CodeMirror (mediawiki, tj. wikitext, je ve výchozím nastavení povolen)
$wgCodeMirrorEnabledModes['javascript'] = true;
$wgCodeMirrorEnabledModes['json'] = true;
$wgCodeMirrorEnabledModes['css'] = true;
$wgCodeMirrorEnabledModes['lua'] = true;
$wgCodeMirrorEnabledModes['vue'] = true;

// Pokud používáte také CodeEditor, deaktivujte tam stejné režimy:
$wgCodeEditorEnabledModes['javascript'] = false;
$wgCodeEditorEnabledModes['json'] = false;
$wgCodeEditorEnabledModes['css'] = false;
$wgCodeEditorEnabledModes['lua'] = false;
$wgCodeEditorEnabledModes['vue'] = false;

// AbuseFilter (všimněte si, že výše není nutné nastavit odpovídající "mód")
$wgAbuseFilterUseCodeEditor = false;
$wgAbuseFilterUseCodeMirror = true;

// Gadgety (pro úpravu stránek JSON s definicemi gadgetů)
$wgGadgetsDefinitionsUseCodeEditor = false;
$wgGadgetsDefinitionsUseCodeMirror = true;

// JsonConfig
$wgJsonConfigUseCodeEditor = false;
$wgJsonConfigUseCodeMirror = true;

// Scribunto (pro úpravu stránek modulů, které používají režim "lua")
$wgScribuntoUseCodeEditor = false;
$wgScribuntoUseCodeMirror = true;

// TemplateStyles
$wgTemplateStylesUseCodeEditor = false;
$wgTemplateStylesUseCodeMirror = true;

// UploadWizard (pro úpravu stránek kampaně JSON)
$wgUploadWizardUseCodeEditor = false;
$wgUploadWizardUseCodeMirror = true;

Registrace nového tagu pro MediaWiki

Pokud chcete, aby CodeMirror jednoduše rozpoznal tag přidaný rozšířením, můžete tak učinit pomocí atributu rozšíření pro atribut CodeMirrorTagModes. Například chcete-li zaregistrovat tag ‎<foo> jako něco obsahujícího wikitext, přidejte k tagu extension.json následující:

{
	"attributes": {
		"CodeMirror": {
			"TagModes": [
				"foo": "mediawiki"
			]
		}
	}
}

CodeMirror poté zvýrazní obsah uvnitř ‎<foo>...‎</foo> jako wikitext.

Registrace tagu tak, aby CodeMirror s obsahem zacházel jako s něčím jiným než wikitextem, momentálně není podporována (T357480). Pokud tag není zaregistrován, CodeMirror zvýrazní obsah jako newikitext stejným způsobem, jako zvýrazní obsah tagu ‎<nowiki>...‎</nowiki>.

Háček PHP

Verze MediaWiki:

≥ 1.44

Od verze MediaWiki 1.44 je preferovaným způsobem integrace s CodeMirror v PHP implementace rozhraní CodeMirrorGetModeHook:

class CodeMirrorHooks implements CodeMirrorGetModeHook {
	public function onCodeMirrorGetMode(Title $title, ?string &$mode, string $model ): bool {
		// Logika pro určení, zda by se měl použít CodeMirror
		if ( $title->hasContentModel( 'JsonLikeContentModel' ) ) {
			$mode = 'json';
			return false;
		}

		return true;
	}
}

Zaregistrujte háček v extension.json:

"Hooks": {
	"CodeMirrorGetMode": "codemirror"
},
"HookHandlers": {
	"codemirror": {
		"class": "MediaWiki\\Extension\\MyExtension\\CodeMirrorHooks"
	}
}

PluginModules

CodeMirrorPluginModules je rozšiřující atribut , který umožňuje načítání modulu z CodeMirror. Toto bezpodmínečně načte modul vždy, když je načten modul ext.CodeMirror.

extension.json:

{
	"attributes": {
		"CodeMirror": {
			"PluginModules": [
				"ext.MyExtension.CodeMirror"
			]
		}
	}
}

JavaScript

Editor CodeMirror není skutečná textarea, ale contenteditable. Vývojáři obvykle potřebují zajistit, aby jejich kód fungoval s oběma, vzhledem k tomu, že CodeMirror lze přepínat vypnuto.

Pro detekci změn v dokumentu je pravděpodobně nejjednodušší pomocí události nebo háčku. Pro čtení a provádění změn může být vhodný jQuery.textSelection.

Pro složitější integrace nebo pro ty, kteří potřebují lepší výkon, můžete přidat vlastní rozšíření k nové nebo existující instanci CodeMirror.

Použití jQuery.textSelection

Pokud chcete jednoduše načíst nebo změnit text dokumentu, je jQuery.textSelection nejjednodušší a nejspolehlivější způsob, jak to udělat. Použití hodnoty jQuery.textSelection v textovém poli je předáváno CodeMirror, takže nemusíte vědět, zda je CodeMirror povolen:

const $textarea = $( '#wpTextbox1' )
const content = $textarea.textSelection( 'getContents' );
// Append "Foobar" to the content.
$textarea.textSelection( 'setContents', content + '\nFoobar' );

Funkce .val() z jQuery na #wpTextbox1 se dá použít,^[8] ale toto se nedoporučuje a nemusí fungovat ve všech editorech, jako je například Editor wikitextu 2017 .

Použití ResourceLoaderu

Rozšíření CodeMirror nabízí řadu modulů o velikosti ResourceLoader pro použití uživatelskými skripty, gadgety a rozšířeními. Pro použití CodeMirror budete potřebovat minimálně modul ext.CodeMirror a požadovaný "režim".

Režimy lze rozbalit z modulů ResourceLoader pomocí exportované metody se stejným názvem jako režim. Pro wikitext MediaWiki byste použili hodnotu ext.CodeMirror.mode.mediawiki a pro JavaScript, JSON, CSS, Vue a Lua byste použili hodnotu ext.CodeMirror.modes:

const require = await mw.loader.using( [ 'ext.CodeMirror', 'ext.CodeMirror.mode.mediawiki' ] );
const CodeMirror = require( 'ext.CodeMirror' );
const { mediawiki } = require( 'ext.CodeMirror.mode.mediawiki' );
const cm = new CodeMirror( myTextarea, mediawiki() );
cm.initialize();

Pokud chcete také WikiEditor:

const require = await mw.loader.using( [
	'ext.wikiEditor',
	'ext.CodeMirror.WikiEditor',
	'ext.CodeMirror.mode.mediawiki'
] );
const textarea = document.getElementById( 'wpTextbox1' );
mw.addWikiEditor( $( textarea ) );
const CodeMirrorWikiEditor = require( 'ext.CodeMirror.WikiEditor' );
const { mediawiki } = require( 'ext.CodeMirror.mode.mediawiki' );
const cmWe = new CodeMirrorWikiEditor( textarea, mediawiki() );
cmWe.mode = 'mediawiki';
cmWe.initialize();

Vytvoření nové instance JavaScriptu:

const require = await mw.loader.using( [ 'ext.CodeMirror', 'ext.CodeMirror.modes' ] );
const CodeMirror = require( 'ext.CodeMirror' );
const { javascript } = require( 'ext.CodeMirror.modes' );
const cm = new CodeMirror( myTextarea, javascript() );
cm.initialize();

Moduly ResourceLoader
Modul	Popis
`ext.CodeMirror.lib`	Základní knihovna CodeMirror. Neměli byste ji vyžadovat přímo, pokud nepotřebujete přístup k upstreamu CodeMirror API.
`ext.CodeMirror`	Základní integrace CodeMirror pro editory MediaWiki. Tento modul exportuje třídu CodeMirror.
`ext.CodeMirror.WikiEditor`	Integrace CodeMirror pro WikiEditor. Tento modul exportuje třídu CodeMirrorWikiEditor.
`ext.CodeMirror.mode.mediawiki`	Exportuje režim `mediawiki` pro zvýraznění wikitextu MediaWiki.
`ext.CodeMirror.modes`	Zahrnuje režimy `javascript`, `json`, `css`, `vue` a `lua`.
`ext.CodeMirror.init` (vnitřní)	Hlavní vstupní bod pro požadavky v hodnotě action=edit. Není určeno pro externí použití.
`ext.CodeMirror.visualEditor.init` (vnitřní)	Integrace CodeMirror s Editor wikitextu 2017 a pouze pro wikitext.

Používání háčků

S CodeMirror se můžete také integrovat pomocí frontend háčků. Ty vám umožňují spouštět kód těsně před nebo po načtení CodeMirroru nebo reagovat na změny v dokumentu.

Frontendové háčky
Háček	Popis
`ext.CodeMirror.initialize`	Voláno těsně před inicializací CodeMirror. Lze to použít k úpravě DOMu tak, aby vyhovoval CodeMirroru (tj. pokud manipulujete s DOMem WikiEditoru, můžete to potřebovat). Parametry (`HTMLTextAreaElement`) současný "editor", s největší pravděpodobností `#wpTextbox1`. (`ve.ui.Surface`) pokud je to relevantní, je na povrch VisualEditoru navázán CodeMirror.
`ext.CodeMirror.ready`	Voláno ihned po inicializaci CodeMirror. Parametry (`CodeMirror`) instance CodeMirror.
`ext.CodeMirror.toggle`	Voláno, když je CodeMirror zapnuto nebo vypnuto. Parametry (`boolean`) zda je CodeMirror nyní povolen. (`CodeMirror`) instance CodeMirror. (`HTMLTextAreaElement`) původní textové pole.
`ext.CodeMirror.destroy`	Voláno ihned po zničení CodeMirror a obnovení původního textarea. Parametry (`HTMLTextAreaElement`) původní textové pole.
`ext.CodeMirror.input`	Voláno, když jsou v CodeMirror provedeny změny dokumentu. Upozorňujeme, že textarea ještě nemusí být aktualizováno. Parametry (`ViewUpdate`) objekt ViewUpdate.
`ext.CodeMirror.preferences.ready`	Vypáleno těsně před vytvořením instance CodeMirrorPreferences. Parametry (`CodeMirrorPreferences`) instance CodeMirrorPreferences.
`ext.CodeMirror.preferences.apply`	Spustí se, když je povolena nebo poprvé použita předvolba CodeMirror v editační relaci. Parametry (`string`) název preference, který je zároveň odpovídajícím klíčem v extensionRegistry a compartmentRegistry. (`boolean`) nová hodnota preference.
`ext.CodeMirror.preferences.display` (vnitřní)	Spustí se při vytvoření panelu předvoleb, těsně před jeho zobrazením. Parametry (`HTMLDivElement`) kontejner panelu předvoleb.
`ext.CodeMirror.gotoLine` (vnitřní)	Spustí se při otevření nebo zavření panelu přejděte na řádek.
`ext.CodeMirror.keymap` (vnitřní)	Spustí se při otevření dialogového okna nápovědy s klávesovými zkratkami.
`ext.CodeMirror.search` (vnitřní)	Spustí se při otevření nebo zavření vyhledávacího panelu.

Používání událostí

Následující události jsou pro usnadnění vývojářům zobrazeny v bublině v textovém poli textarea:

Pomocí těchto událostí se můžete integrovat s CodeMirror a použít stejný kód jako původní textarea:

myTextarea.addEventListener( 'keyup', ( event ) => {
	console.log( event.key );
} );

Rozšíření CodeMirror

Modul ext.CodeMirror.lib můžete importovat, abyste získali přístup k upstreamu CodeMirror API. S tímto můžete při vytváření instance CodeMirror nebo objektu CodeMirrorWikiEditor zadat vlastní rozšíření.

Například pro vytvoření vlastního rozšíření, které reaguje na změny provedené v CodeMirror:

const require = await mw.loader.using( [ 'ext.CodeMirror', 'ext.CodeMirror.mode.mediawiki' ] );
const CodeMirror = require( 'ext.CodeMirror' );
const { mediawiki } = require( 'ext.CodeMirror.mode.mediawiki' );
// ext.CodeMirror.lib je závislostí ext.CodeMirror, takže je v tomto okamžiku již načten.
const { EditorView } = require( 'ext.CodeMirror.lib' );
const myExtension = EditorView.updateListener.of( ( /** @type {ViewUpdate} */ update ) => {
	if ( update.docChanged ) {
	    // nic nedělá
	    console.log( update.changes );
	}
} );
const cm = new CodeMirror( myTextarea, mediawiki() );
cm.initialize( [ cm.defaultExtensions, myExtension ] );

Nebo pokud potřebujete interagovat s existující instancí CodeMirror:

// Nejprve se ujistěte, že je CodeMirror inicializován.
mw.hook( 'ext.CodeMirror.ready' ).add( ( cm ) => {
	const { EditorView } = require( 'ext.CodeMirror.lib' );
	const myExtension = EditorView.updateListener.of( ( /** @type {ViewUpdate} */ update ) => {
		if ( update.docChanged ) {
		    // nic nedělá
		    console.log( update.changes );
		}
	} );
	cm.applyExtension( myExtension );
} );

Dalším způsobem, jak naslouchat změnám, je použití ext.CodeMirror.input háčku:

mw.hook( 'ext.CodeMirror.input' ).add( ( update ) => {
	// Vypište ChangeSet do konzole
	console.log( update.changes.toJSON() );
} );

Historie vydání

listopadu 2024 – Verze rozšíření CodeMirror 6 byla představena jako beta funkce.
21. dubna 2026 – Po dvou letech vývoje a testování byla oficiálně povýšena verze "Vylepšené zvýrazňování syntaxe" (CodeMirror 6) z beta verze. Tato aktualizace přinesla všem uživatelům standardního zvýrazňovače syntaxe pokročilé funkce, jako je skládání kódu, automatické doplňování a linting, a zároveň výrazně zlepšila čitelnost wikitextu.^[10]

Související odkazy

User:Remember the dot/Syntax highlighter
Extension:VisualEditor
Extension:WikiEditor
Extension:CodeEditor
EditorAPIs: A library that presents a common interface for wikitext editing. Support for the legacy editor, VE, 2017 source editor and CodeMirror 5/6.
c:Category:MediaWiki extension CodeMirror

Poznámky pod čarou

↑ $wgCodeMirrorDefaultPreferencesCode
↑ V editoru z roku 2017 je důraz vždy kladen na editor.
↑ Tato funkce zatím není stabilní.
↑ Má to vliv pouze ve wikitextu.
↑ Platí pouze pro wikitext.
↑ Platí pouze pro wikitext.
↑ Zalamování řádků nelze v editoru 2017 zakázat.
↑ phab:T384556
↑ Tato událost se nespustí pro wikitext (T401271)
↑ Tech News 2026 – Issue 17, Wikimedia Diff. Published April 20, 2026.

Toto rozšíření se používá na jednom nebo více projektech Wikimedia. Pravděpodobně to znamená, že rozšíření je stabilní a funguje dostatečně dobře, aby jej mohly používat weby s tak vysokou návštěvností. Vyhledejte tento název rozšíření v konfiguračních souborech CommonSettings.php a InitialiseSettings.php Wikimedie, abyste viděli, kde je nainstalováno. Úplný seznam rozšíření nainstalovaných na konkrétní wiki lze vidět na stránce wiki Special:Version.

Toto rozšíření je zahrnuto v následujících wiki farmách/hostitelích a/nebo balíčcích:

[1] $wgCodeMirrorDefaultPreferencesCode

[2] V editoru z roku 2017 je důraz vždy kladen na editor.

[3] Tato funkce zatím není stabilní.

[4] Má to vliv pouze ve wikitextu.

[5] Platí pouze pro wikitext.

[6] Platí pouze pro wikitext.

[7] Zalamování řádků nelze v editoru 2017 zakázat.

[8] :T384556

[9] Tato událost se nespustí pro wikitext (T401271)

[10] Tech News 2026 – Issue 17, Wikimedia Diff. Published April 20, 2026.

[1]

[2]

[3]

[4]

[5]

[6]

[7]

[8]

[9]

[10]