哪位达人指导下，在 vue cli 中如何使用 highlightjs-line-numbers 插件？

highlight.js是用来高亮显示代码的工具。 配合它还有一个显示行号的插件highlightjs-line-numbers.js

在传统网页中，使用方法：

hljs.initHighlightingOnLoad(); hljs.initLineNumbersOnLoad(); 

在 vue cli 开发中无法使用成功，这是我的语法，哪位大哥指导下：

<script> import hljs from 'highlight.js' import 'highlight.js/styles/atom-one-dark.css' import 'highlightjs-line-numbers.js/src/highlightjs-line-numbers.js' //Markdown 编辑器之行号与加色显示 /* // lineNumbersBlock 不会引用，无法产生行号 文档： https://rkroom.com/post/nuxt-vue-layout-style https://github.com/wcoder/highlightjs-line-numbers.js/ */ const highlightCode = () => { const preEl = document.querySelectorAll('pre') preEl.forEach((el) => { hljs.highlightBlock(el); }); } export default { name: 'myContent', data: function () { var ref = this; var id = ref.$route.params.id; var model = {conMod: {createTime:""}, node: {}}; this.jsp("content_get",{"id":id}).then((ret)=>{ model.cOnMod=JSON.parse(ret.result)[0]; this.jsp("model_get",{"id":model.conMod.modelId}).then((ret)=>{model.node=JSON.parse(ret.result);}) }) return model; }, methods: { navToList: function () { this.$route.push("/list/" + this.conMod.ModelID); } }, mounted() { highlightCode() lineNumbersBlock() }, updated () { highlightCode() lineNumbersBlock() } } </script>