posthtml / posthtml-highlight

:art: Syntax Highlighting for PostHTML

PostHTML Highlight Plugin

Compile-time syntax highlighting for code blocks via highlight.js

Before:

<pre><code>
  const foo = 'foo'
  console.log(foo)
</code></pre>

After:

<pre><code class="hljs">
  <span class="hljs-keyword">const</span> foo = <span class="hljs-string">'foo'</span>
  console.<span class="hljs-built_in">log</span>(foo)
</code></pre>

Install

$ yarn add -D posthtml posthtml-highlight

or

$ npm i posthtml posthtml-highlight

If using TypeScript, additionally install @types/highlight.js

Usage

const fs = require('fs')
const posthtml = require('posthtml')
const highlight = require('posthtml-highlight')

const source = fs.readFileSync('./before.html')

posthtml([
  highlight(
    /* optional */ {
      /**
       * By default, only code tags wrapped in pre tags are highlighted (i.e. <pre><code><code/><pre/>)
       *
       * Set `inline: true` to highlight all code tags
       */
      inline: true,

      /**
       * You may also pass any highlight.js options (http://highlightjs.readthedocs.io/en/latest/api.html#configure-options)
       */
      useBR: true,
    }
  ),
])
  .process(source)
  .then((result) => fs.writeFileSync('./after.html', result.html))

Styling

You will also need to include a highlight.js stylesheet

View the available color schemes here, then
a) include via a CDN
b) install via npm (yarn add -D highlight.js, ./node_modules/highlight.js/styles/*)
c) download via the highlight.js repo

Specifying a language

Specifying a language as per highlight.js's usage docs is supported, with the caveat that you must use the lang-* or language-* prefix

Skip highlighting on a node

Add the nohighlight class as per highlight.js's usage docs

posthtml-highlight's Issues

An in-range update of ts-jest is breaking the build 🚨

The devDependency ts-jest was updated from 23.1.4 to 23.10.0.

🚨 View failing branch.

This version is covered by your current version range and after updating it in your project the build failed.

ts-jest is a devDependency of this project. It might not break your production code or affect downstream projects, but probably breaks your build or test tools, which may prevent deploying or publishing.

Status Details

• ❌ continuous-integration/travis-ci/push: The Travis CI build failed (Details).

---

Release Notes for 23.10.0

ts-jest, reloaded!

• lots of new features including full type-checking and internal cache (see changelog)
• improved performances
• Babel not required anymore
• improved (and growing) documentation
• a ts-jest Slack community where you can find some instant help
• end-to-end isolated testing over multiple jest, typescript and babel versions

Commits

The new version differs by 293 commits.

• 0e5ffed chore(release): 23.10.0
• 3665609 Merge pull request #734 from huafu/appveyor-optimizations
• 45d44d1 Merge branch 'master' into appveyor-optimizations
• 76e2fe5 ci(appveyor): cache npm versions as well
• 191c464 ci(appveyor): try to improve appveyor's config
• 0f31b42 Merge pull request #733 from huafu/fix-test-snap
• 661853a Merge branch 'master' into fix-test-snap
• aa7458a Merge pull request #731 from kulshekhar/dependabot/npm_and_yarn/tslint-plugin-prettier-2.0.0
• 70775f1 ci(lint): run lint scripts in series instead of parallel
• a18e919 style(fix): exclude package.json from tslint rules
• 011b580 test(config): stop using snapshots for pkg versions
• 7e5a3a1 build(deps-dev): bump tslint-plugin-prettier from 1.3.0 to 2.0.0
• fbe90a9 Merge pull request #730 from kulshekhar/dependabot/npm_and_yarn/@types/node-10.10.1
• a88456e build(deps-dev): bump @types/node from 10.9.4 to 10.10.1
• 54fd239 Merge pull request #729 from kulshekhar/dependabot/npm_and_yarn/prettier-1.14.3

There are 250 commits in total.

See the full diff

FAQ and help

There is a collection of frequently asked questions. If those don’t help, you can always ask the humans behind Greenkeeper.

---

Your Greenkeeper Bot 🌴

An in-range update of @types/jest is breaking the build 🚨

The devDependency @types/jest was updated from 24.0.2 to 24.0.3.

🚨 View failing branch.

This version is covered by your current version range and after updating it in your project the build failed.

@types/jest is a devDependency of this project. It might not break your production code or affect downstream projects, but probably breaks your build or test tools, which may prevent deploying or publishing.

Status Details

• ❌ continuous-integration/travis-ci/push: The Travis CI build failed (Details).

---

FAQ and help

There is a collection of frequently asked questions. If those don’t help, you can always ask the humans behind Greenkeeper.

---

Your Greenkeeper Bot 🌴

Deprecation notice when using class .language-*

Node - 16.13.0
HighlightJS - 11.3.1
PostHTML - 0.16.5
posthtml-highlight - 1.1.2

I really appreciate you creating this plugin and have been using it with Parcel v2 using a simple .posthtmlrc which is as follows:

{
    "plugins": {
        "posthtml-highlight": {
            "inline": true
        }
    }
}

This allows me ship highlighted code-blocks in my website without shipping hljs with it however in areas where the highlighting isn't working properly, I add the language specific classes like .language-cpp to the <code> element which invariably leads to this notice on build-time which I do not get when they are removed.

console: Deprecated as of 10.7.0. highlight(lang, code, ...args) has been deprecated.
console: Deprecated as of 10.7.0. Please use highlight(code, options) instead.
https://github.com/highlightjs/highlight.js/issues/2277

Even though the src/index.ts of this project suggests that this notice shouldn't be shown, I could be wrong in my superficial reading of the code. I'm just bringing this to your notice to test out.

Cheers

Upgrade to last PostHTML version

I am getting this error:

npm WARN [email protected] requires a peer of posthtml@^0.15.1 but none is installed. You must install peer dependencies yourself.

Can you upgrade to last posthtml?

thanks

Action required: Greenkeeper could not be activated 🚨

🚨 You need to enable Continuous Integration on all branches of this repository. 🚨

To enable Greenkeeper, you need to make sure that a commit status is reported on all branches. This is required by Greenkeeper because it uses your CI build statuses to figure out when to notify you about breaking changes.

Since we didn’t receive a CI status on the greenkeeper/initial branch, it’s possible that you don’t have CI set up yet. We recommend using Travis CI, but Greenkeeper will work with every other CI service as well.

If you have already set up a CI for this repository, you might need to check how it’s configured. Make sure it is set to run on all new branches. If you don’t want it to run on absolutely every branch, you can whitelist branches starting with greenkeeper/.

Once you have installed and configured CI on this repository correctly, you’ll need to re-trigger Greenkeeper’s initial pull request. To do this, please delete the greenkeeper/initial branch in this repository, and then remove and re-add this repository to the Greenkeeper App’s white list on Github. You'll find this list on your repo or organization’s settings page, under Installed GitHub Apps.

help find your package

@caseyWebb Hi, I am a posthtml package maintainer, I found your package because you have a posthtml package in dependencies. I think it will be easier for people to find your package if you add it to the list of plugins here and here, and of course the first thing to do in the posthtml organization itself - I can move your package to the posthtml organization for more popularity, for this it will be necessary to add me to this repository and then I will transfer it. The package itself will remain under your control.

let me know about any decision you make, i will understand if you are not interested

An in-range update of @types/node is breaking the build 🚨

The devDependency @types/node was updated from 10.11.0 to 10.11.1.

🚨 View failing branch.

This version is covered by your current version range and after updating it in your project the build failed.

@types/node is a devDependency of this project. It might not break your production code or affect downstream projects, but probably breaks your build or test tools, which may prevent deploying or publishing.

Status Details

• ❌ continuous-integration/travis-ci/push: The Travis CI build failed (Details).

---

FAQ and help

There is a collection of frequently asked questions. If those don’t help, you can always ask the humans behind Greenkeeper.

---

Your Greenkeeper Bot 🌴