vue3-hljs v0.1.4

vue-highlight 基于vue.js 3.x封装的指令

引入npm包

npm i vue3-hljs

在main.js中use当前的指令和导入highlight.js的主题

import hljs from "vue3-hljs"
import "highlight.js/styles/dark.css"

createApp(App).use(hljs).mount('#app')

在html代码上使用v-hljs

<pre>
    <code v-hljs class="javascript">
export default {
  name: "App",
  components: {
    HelloWorld,
  },
};
    </code>
</pre>

然后运行。就可以看到pre->code标签下的代码已经被渲染成高亮格式了

npm地址 vue3-hljs.