x-postpress-code

x-postpress-code

A web component used for code highlighting. Try it out at JS BIN.

Usage

Use the type attribute and include the source in the default slot with pre tags to render static content:

<x-postpress-code type="bash"><pre>
#/usr/bin/env bash
for file in *; do
  echo $file
done
</pre></x-postpress-code>

Lazy load the content to be highlighted by using both the type and src attributes:

<x-postpress-code
  src="https://example.com/example.js"
  type="js"
></x-postpress-code>

Installation

from unpkg:

<script
  src="https://unpkg.com/x-postpress-code"
  type="module"
></script>

from npm:

npm i x-postpress-code

import 'x-postpress-code'

Uses the following highlight.js languages:

• bash
• c
• cpp
• css
• javascript
• json
• markdown
• php
• plaintext
• python
• shell
• typescript
• xml