Skip to content

Commit

Permalink
(chore) es6 via CDN (#3412)
Browse files Browse the repository at this point in the history
  • Loading branch information
joshgoebel committed Dec 9, 2021
1 parent c37ef5b commit 84719c1
Showing 1 changed file with 55 additions and 4 deletions.
59 changes: 55 additions & 4 deletions README.md
Expand Up @@ -48,6 +48,9 @@ detection.
- [ES6 Modules / `import`](#es6-modules--import)
- [Getting the Library](#getting-the-library)
- [Fetch via CDN](#fetch-via-cdn)
- [cdnjs (link)](#cdnjs-link)
- [jsdelivr (link)](#jsdelivr-link)
- [unpkg (link)](#unpkg-link)
- [Download prebuilt CDN assets](#download-prebuilt-cdn-assets)
- [Download from our website](#download-from-our-website)
- [Install via NPM package](#install-via-npm-package)
Expand Down Expand Up @@ -268,13 +271,16 @@ const highlightedCode = hljs.highlight('<span>Hello World!</span>', {language: '

### ES6 Modules / `import`

*Note: You can also import directly from fully static URLs, such as our very own pre-built
ES6 Module CDN resources. See [Fetch via CDN](#fetch-via-cdn) for specific examples.*

The default import will register all languages:

```js
import hljs from 'highlight.js';
```

It is more efficient to import only the library and register the languages you need:
It is more efficient to import only the library and register the languages you need:

```js
import hljs from 'highlight.js/lib/core';
Expand Down Expand Up @@ -317,7 +323,9 @@ A prebuilt version of Highlight.js bundled with many common languages is hosted
When using Highlight.js via CDN you can use Subresource Integrity for additional security. For details
see [DIGESTS.md](https://github.com/highlightjs/cdn-release/blob/main/DIGESTS.md).

**cdnjs** ([link](https://cdnjs.com/libraries/highlight.js))
#### cdnjs ([link](https://cdnjs.com/libraries/highlight.js))

##### Common JS <!-- omit in toc -->

```html
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.3.1/styles/default.min.css">
Expand All @@ -326,7 +334,23 @@ see [DIGESTS.md](https://github.com/highlightjs/cdn-release/blob/main/DIGESTS.md
<script src="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.3.1/languages/go.min.js"></script>
```

**jsdelivr** ([link](https://www.jsdelivr.com/package/gh/highlightjs/cdn-release))
##### ES6 Modules <!-- omit in toc -->

````html
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.3.1/styles/dark.min.css">
<script type="module">
import hljs from 'https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.3.1/es/highlight.min.js';
// and it's easy to individually load additional languages
import go from 'https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.3.1/es/languages/go.min.js';
hljs.registerLanguage('go', go);
</script>

````


#### jsdelivr ([link](https://www.jsdelivr.com/package/gh/highlightjs/cdn-release))

##### Common JS <!-- omit in toc -->

```html
<link rel="stylesheet" href="https://cdn.jsdelivr.net/gh/highlightjs/cdn-release@11.3.1/build/styles/default.min.css">
Expand All @@ -335,7 +359,21 @@ see [DIGESTS.md](https://github.com/highlightjs/cdn-release/blob/main/DIGESTS.md
<script src="https://cdn.jsdelivr.net/gh/highlightjs/cdn-release@11.3.1/build/languages/go.min.js"></script>
```

**unpkg** ([link](https://unpkg.com/browse/@highlightjs/cdn-assets/))
##### ES6 Modules <!-- omit in toc -->

```html
<link rel="stylesheet" href="https://cdn.jsdelivr.net/gh/highlightjs/cdn-release@11.3.1/build/styles/default.min.css">
<script type="module">
import hljs from 'https://cdn.jsdelivr.net/gh/highlightjs/cdn-release@11.3.1/build/es/highlight.min.js';
// and it's easy to individually load additional languages
import go from 'https://cdn.jsdelivr.net/gh/highlightjs/cdn-release@11.3.1/build/es/languages/go.min.js';
hljs.registerLanguage('go', go);
</script>
```

#### unpkg ([link](https://unpkg.com/browse/@highlightjs/cdn-assets/))

##### Common JS <!-- omit in toc -->

```html
<link rel="stylesheet" href="https://unpkg.com/@highlightjs/cdn-assets@11.3.1/styles/default.min.css">
Expand All @@ -344,6 +382,19 @@ see [DIGESTS.md](https://github.com/highlightjs/cdn-release/blob/main/DIGESTS.md
<script src="https://unpkg.com/@highlightjs/cdn-assets@11.3.1/languages/go.min.js"></script>
```

##### ES6 Modules <!-- omit in toc -->

```html
<link rel="stylesheet" href="https://unpkg.com/@highlightjs/cdn-assets@11.3.1/styles/default.min.css">
<script type="module">
import hljs from 'https://unpkg.com/@highlightjs/cdn-assets@11.3.1/es/highlight.min.js';
// and it's easy to individually load & register additional languages
import go from 'https://unpkg.com/@highlightjs/cdn-assets@11.3.1/es/languages/go.min.js';
hljs.registerLanguage('go', go);
</script>
```


**Note:** *The CDN-hosted `highlight.min.js` package doesn't bundle every language.* It would be
very large. You can find our list of "common" languages that we bundle by default on our [download page][5].

Expand Down

0 comments on commit 84719c1

Please sign in to comment.