So markieren Sie Code in vue.js

So markieren Sie Code in vue.js: Zuerst müssen Sie die Abhängigkeiten herunterladen und das Paket in die Datei [main.js] importieren. Anschließend müssen Sie einen Befehl in der Datei [main.js] anpassen Geben Sie in der VUE-Datei einfach den Befehl ein.

Die Betriebsumgebung dieses Tutorials: Windows10-System, vue2.9, dieser Artikel gilt für alle Computermarken.

【Empfohlene verwandte Artikel: vue.js】

So markieren Sie Code in vue.js:

1. Zuerst müssen Sie die Abhängigkeiten herunterladen:

npm install highlight.js --save

2. Importieren Sie das Paket in main.js-Datei:

import hljs from 'highlight.js' //导入代码高亮文件
import 'highlight.js/styles/monokai-sublime.css'  //导入代码高亮样式

3. Passen Sie außerdem einen Befehl in der main.js-Datei an:

//自定义一个代码高亮指令
Vue.directive('highlight',function (el) {
  let highlight = el.querySelectorAll('pre code');
  highlight.forEach((block)=>{
      hljs.highlightBlock(block)
  })
})

4 :

Javascript

(Video)

Das obige ist der detaillierte Inhalt vonSo markieren Sie Code in vue.js. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!