vue3 highlightjs

Vue 3是一种流行的JavaScript框架，用于构用户界面。它具有高效的响应式数据绑定和组件化开发的能力。而highlight.js是一个用于在网页上高亮显示代码的JavaScript库。

在Vue 3中使用highlight.js可以通过以下步骤实现：

1. 首先，你需要安装highlight.js库。可以通过npm或者yarn进行安装：

npm install highlight.js

或者

yarn add highlight.js

2. 在Vue 3项目中，你可以在需要使用highlight.js的组件中引入highlight.js库：

import hljs from 'highlight.js';

3. 接下来，你需要在组件的`mounted`生命周期钩子函数中初始化highlight.js，并指定要高亮显示的代码块的语言：

mounted() {
  hljs.highlightAll();
}

4. 最后，在模板中使用`<pre>`和`<code>`标签来包裹你想要高亮显示的代码块，并为`<code>`标签添加`class`属性指定代码块的语言：

<template>
  <pre>
    <code class="javascript">
      // Your code here
    </code>
  </pre>
</template>

这样，你就可以在Vue 3项目中使用highlight.js来高亮显示代码了。