| 123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203 |
- # Upgrading to Highlight.js v11.0
- - [Overview of Breaking Changes](#overview-of-breaking-changes)
- - [Built-in set of "Common" Languages](#built-in-set-of-common-languages)
- - [Language Files](#language-files)
- - [Language Aliases](#language-aliases)
- - [Styles and CSS](#styles-and-css)
- - [Grammar Scopes](#grammar-scopes)
- - [Behavioral changes](#behavioral-changes)
- - [API changes](#api-changes)
- - [Changes to Result Data](#changes-to-result-data)
- - [Feature Removal](#feature-removal)
- - [Small Things](#small-things)
- - [Upgrading from Version 9.x](#upgrading-from-version-9x)
- ## Overview of Breaking Changes
- Welcome to version 11.0. This a major release and therefore contains breaking changes. Below is a complete list of those such changes.
- ### Built-in set of "Common" Languages
- The default `highlight.min.js` build **removes** a few less popular grammars:
- - apache
- - http
- - nginx
- - properties
- - coffeescript
- If you need any of these, you can always create a custom build.
- Ref: https://github.com/highlightjs/highlight.js/issues/2848
- ### Language Files
- This would matter if you are requiring any of these files directly (via Node.js or CDN).
- - `htmlbars` has been removed. Use `handlebars` instead.
- - `c-like` has been removed. Use `c`, `cpp`, or `arduino`.
- - `sql_more` has been removed. Use `sql` instead or a more specific 3rd party grammar.
- ### Language Aliases
- This would matter if you are using these aliases.
- - `php3`,`php4`,`php5`, `php6`, `php7`, and `php8` have been removed. Use `php` instead.
- - `zsh` has been removed. Use `sh` or `bash` instead.
- - `freepascal`, `lazarus`, `lpr`, and `lpm` removed. Use `delphi` instead.
- You can of course re-register any of these aliases easily if necessary. For example to restore the PHP aliases:
- ```js
- hljs.registerAliases(["php3","php4","php5","php6","php7","php8"],{ languageName: "php" })
- ```
- ### Styles and CSS
- - The default padding on `.hljs` element has been increased and is now `1em` (it was `0.5em` previously). If your design depends on the smaller spacing you may need to update your CSS to override.
- - `schoolbook` no longer has a custom lined background, it is solid color now. The old image and CSS can be found in the [10-stable branch](https://github.com/highlightjs/highlight.js/tree/10-stable/src/styles) if you wish to manually copy it into your project.
- - `github` includes significant changes to more properly match modern GitHub syntax highlighting. If you desire the old theme you can manually copy it into your project from the [10-stable branch](https://github.com/highlightjs/highlight.js/tree/10-stable/src/styles).
- - `github-gist` has been removed in favor of `github` as GitHub and GitHub Gist have converged. If you desire the theme you can manually copy it into your project from the [10-stable branch](https://github.com/highlightjs/highlight.js/tree/10-stable/src/styles).
- - The `.hljs` CSS selector is now further scoped. It now targets `code.hljs` (inline code) and `pre code.hljs` (code blocks). If you are using a different element you may need to update your CSS to reapply some styling.
- - All [Base16 themes](https://github.com/highlightjs/base16-highlightjs) now live in the `styles/base16` directory - this means some CSS files have moved. Please confirm themes you use reference the new locations.
- #### Grammar Scopes
- - `.meta-string` removed/deprecated. Use `.meta .string` (a nested scope) instead. See [meta-keyword][].
- - `.meta-keyword` removed/deprecated. Use `.meta .keyword` (a nested scope) instead. See [meta-keyword][].
- ### Behavioral changes
- - `after:highlightElement` plugin callback is now fired *after* the DOM has been updated, not before.
- #### API changes
- - The option `ignoreIllegals` is now `true` by default (for `highlight()`). Previously it was `false`.
- - The `highlight(language,code, ...args)` API no longer accepts `continuation` as a 4th argument.
- - The `highlight(language,code, ...args)` API is deprecated (to be removed in 12.0).
- The new call signature is `highlight(code, {options})`. ([see docs](https://highlightjs.readthedocs.io/en/latest/api.html#highlight))
- Code using the old API:
- ```js
- // highlight(language, code, ignoreIllegals, continuation)
- highlight("javascript", "var a = 5;", true)
- ```
- ...would be upgraded to the newer API as follows:
- ```js
- // highlight(code, {language, ignoreIllegals})
- highlight("var a = 5;", {language: "javascript", ignoreIllegals: true})
- ```
- The new API purposely does not support `continuation` as this is only intended for internal library usage.
- - `initHighlighting()` is deprecated (to be removed in 12.0).
- - `initHighlightingOnLoad()` is deprecated (to be removed in 12.0).
- **Use `highlightAll()` instead.** ([see docs](https://highlightjs.readthedocs.io/en/latest/api.html#highlight-all)) The old functions are now simply aliases of `highlightAll()`. The new function may be called before or after the DOM is loaded and should do the correct thing in all cases, replacing the need for the previous individual functions.
- Note: `highlightAll()` does not guard against calling itself repeatedly as the previous functions did. Your code should be careful to avoid doing this.
- - `highlightBlock()` is deprecated (to be removed in 12.0).
- **Use `highlightElement()` instead.** ([see docs](https://highlightjs.readthedocs.io/en/latest/api.html#highlight-element)) This is merely a naming change.
- Note: The object literal passed to the `before:highlightElement` callback now passes the element in the `el` key vs the `block` key.
- ##### Changes to Result Data
- - `highlightAuto()`'s `second_best` key has been renamed to `secondBest`
- - `highlightElement()`'s result now no longer includes a `re` key. Use the `relevance` key now.
- - `highlight()` renames some result keys to more clearly mark them as private: `_top`, `_emitter`, and `_illegalBy`. You should not depend on these keys as they are subject to change at any time.
- - The `relevance` key returned by `highlight()` is no longer guaranteed to be an even integer.
- - `highlightElement` now always tags blocks with a consistent `language-[name]` class
- This behavior was inconsistent before. Sometimes `[name]` class would be added, sometimes the alias name would be added, something no class would be added. now `language-[name]` is always added. This also affects sublanguage `span` tags which now also include the `language-` prefix.
- #### Feature Removal
- - HTML auto-passthru is now no longer included in core. Use a plugin instead. For a possible plugin please see [#2889](https://github.com/highlightjs/highlight.js/issues/2889).
- An example:
- ```html
- <pre><code class="lang-js">
- var a = 4;
- <span class="yellow">var a = 4;</span>
- </code></pre>
- ```
- Unescaped HTML like this will now be ignored (stripped before highlighting) and a warning will be logged to the console. All HTML to be highlighted should be properly escaped to avoid potential HTML/JS injection attacks.
- - `fixMarkup` has been removed.
- This function was deprecated in v10.2. It is not our goal to provide random string utilities. You may need to provide your own replacement [Ref: #2534](https://github.com/highlightjs/highlight.js/issues/2634)
- - `CSS_NUMBER_MODE` has been removed.
- This rule was too broad for bring inclusion in core and has been removed.
- - `lexemes` mode attribute has been removed.
- Use the new `keywords.$pattern` instead.
- Before:
- ```js
- {
- keywords: "do.it start.now begin.later end.immediately"
- lexemes: /[a-z.]+/
- }
- ```
- After:
- ```js
- {
- keywords: {
- $pattern: /[a-z.]+/
- keyword: "do.it start.now begin.later end.immediately",
- }
- }
- ```
- This may required converting your `keywords` key into an object if it's not already (as shown above).
- - `endSameAsBegin` mode attribute has been removed.
- Use the new `END_SAME_AS_BEGIN` mode rule/function instead.
- - `useBR` configuration has been removed.
- This configuration option was deprecated in v10.1. Use a plugin or preferably simply CSS `white-space: pre`. [Ref: #2559](https://github.com/highlightjs/highlight.js/issues/2559)
- - `tabReplace` configuration has been removed.
- This configuration option was deprecated in v10.5. Use a plugin or pre-render content instead with desired spacing. [Ref: #2874](https://github.com/highlightjs/highlight.js/issues/2874)
- ### Small Things
- - The `regex` utility `join` has been renamed to `_eitherRewriteBackreferences` (this has always been intended for internal use only)
- ### Upgrading from Version 9.x
- If you're upgrading all the way from version 9 it may still be helpful to review all the breaking changes in version 10 as well:
- - [VERSION_10_UPGRADE.md](https://github.com/highlightjs/highlight.js/blob/main/VERSION_10_UPGRADE.md)
- - [VERSION_10_BREAKING_CHANGES.md](https://github.com/highlightjs/highlight.js/blob/main/VERSION_10_BREAKING_CHANGES.md)
- [meta-keyword]: https://github.com/highlightjs/highlight.js/pull/3167
|