Fantastico modulo della community

Highlight.js

Stato build

Highlight.js è un evidenziatore di sintassi scritto in JavaScript. Funziona sia nel browser che sul server. Funziona praticamente con qualsiasi markup, non dipende da alcun framework e dispone del rilevamento automatico della lingua.

Iniziare

Il minimo initHighlightingOnLoad per utilizzare highlight.js su una pagina Web è collegarsi alla libreria insieme a uno degli stili e chiamare initHighlightingOnLoad :

1 2 3
<link rel="stylesheet" href="/path/to/styles/default.css"> <script src="/path/to/highlight.pack.js"></script> <script>hljs.initHighlightingOnLoad();</script>

Questo troverà ed evidenzierà il codice all'interno dei <pre><code> ; cerca di rilevare automaticamente la lingua. Se il rilevamento automatico non funziona per te, puoi specificare la lingua nell'attributo class :

1
<pre><code class="html">...</code></pre>

L'elenco delle classi di lingue supportate è disponibile nel riferimento alle classi. Le classi possono anche essere precedute da language- o lang- .

Per disabilitare del nohighlight evidenziazione usa la classe nohighlight :

1
<pre><code class="nohighlight">...</code></pre>

Inizializzazione personalizzata

Quando hai bisogno di un po 'più di controllo sull'inizializzazione di highlight.js, puoi usare highlightBlock e configure funzioni, che ti permettono di controllare cosa evidenziare e quando .

Ecco un modo equivalente per chiamare initHighlightingOnLoad usando jQuery:

1 2 3 4 5
$(document).ready(function() { $('pre code').each(function(i, block) { hljs.highlightBlock(block); }); });

Puoi utilizzare qualsiasi tag invece di <pre><code> per contrassegnare il tuo codice. Se non utilizzi un contenitore che conserva le interruzioni di riga, dovrai configurare highlight.js per utilizzare il tag <br> :

1 2 3 4 5
hljs.configure({useBR: true}); $('div.code').each(function(i, block) { hljs.highlightBlock(block); });

Per altre opzioni fare riferimento alla documentazione per configure .

Web Workers

È possibile eseguire l'evidenziazione all'interno di un web worker per evitare di bloccare la finestra del browser durante la gestione di blocchi di codice molto grandi.

Nel tuo script principale:

1 2 3 4 5 6
addEventListener('load', function() { var code = document.querySelector('#code'); var worker = new Worker('worker.js'); worker.onmessage = function(event) { code.innerHTML = event.data; } worker.postMessage(code.textContent); })

In worker.js:

1 2 3 4 5
onmessage = function(event) { importScripts('<path>/highlight.pack.js'); var result = self.hljs.highlightAuto(event.data); postMessage(result.value); }

Ottenere la libreria

Puoi ottenere highlight.js come script del browser ospitato o personalizzato o come modulo server. Lo script del browser supporta sia AMD che CommonJS, quindi se lo desideri puoi usare RequireJS o Browserify senza doverlo fare build from source. Il modulo server funziona perfettamente anche con Browserify, ma c'è la possibilità di usare una build specifica per i browser piuttosto che qualcosa di inteso per un server. Vai alla pagina di download per tutte le opzioni.

Non collegare direttamente a GitHub. La libreria non dovrebbe funzionare direttamente dal sorgente, richiede la compilazione. Se nessuna delle opzioni preconfezionate funziona, fai riferimento alla documentazione di costruzione .

Il pacchetto ospitato dalla CDN non ha tutte le lingue. Altrimenti sarebbe troppo grande. Se non vedi la lingua che ti serve nella sezione "Comune" , può essere aggiunta manualmente:

1
<script src="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.4.0/languages/go.min.js"></script>

Su Almond. È necessario utilizzare l'ottimizzatore per assegnare un nome al modulo. Ad esempio:

1
r.js -o name=hljs paths.hljs=/path/to/highlight out=highlight.js

Licenza

Highlight.js è rilasciato con licenza BSD. Vedere il file LICENSE per i dettagli.

Il sito ufficiale della biblioteca è all'indirizzo https://highlightjs.org/ .

Ulteriore documentazione approfondita per l'API e altri argomenti è disponibile all'indirizzo http://highlightjs.readthedocs.io/ .

Autori e collaboratori sono elencati nel file AUTHORS.en.txt .