安装配置
npm install highlight.js --save npm install --save vue-highlightjs
main.js
import VueHighlightJS from 'vue-highlightjs' import 'highlight.js/styles/monokai-sublime.css' Vue.use(VueHighlightJS)
使用
vue文件中
<pre v-highlightjs> <code class="javaScript">{{code}}</code> </pre>
根据代码类型修改class的值,比如HTML代码,则class=‘html’
高亮显示的代码写在data里的code变量里
data() { return { code: '<h1>标题</h1>', } },
最终效果