vue-hljs

Overview

ℹ️ Update: Highlight.js has released an official vue plugin since Mar 23, 2021. See highlightjs/vue-plugin.

This is a vue plugin which allows you to highlight code blocks via vue-directive.

Install

``bash npm install vue-hljs highlight.js`or`bash yarn add vue-hljs highlight.js`

`Example`

typescript
import { createApp } from 'vue'
import vueHljs from "vue-hljs";
import hljs from "highlight.js";
//if you want to use default color, import this css file
import "vue-hljs/style.css";

const app = createApp({}) app.use(vueHljs, { hljs })`

`html

...

Use your own style

This plugin use gruvbox-dark as default style.

You can write your own style or see highlight.js demo.
And then import your css file in Vue project entry.

Other similar projects

- highlightjs/vue-plugin: Highlight.js official plugin.