update dep

package.json

@@ -17,6 +17,7 @@
   },
   "dependencies": {
     "@element-plus/icons-vue": "2.0.10",
+    "@highlightjs/vue-plugin": "^2.1.0",
     "@vueup/vue-quill": "1.1.0",
     "@vueuse/core": "9.5.0",
     "axios": "0.27.2",
@@ -24,6 +25,7 @@
     "element-plus": "2.2.27",
     "file-saver": "2.0.5",
     "fuse.js": "6.6.2",
+    "highlight.js": "^11.8.0",
     "js-cookie": "3.0.1",
     "jsencrypt": "3.3.1",
     "lodash-es": "^4.17.21",

src/main.js

@@ -2,6 +2,10 @@ import { createApp } from "vue";
 
 import Cookies from "js-cookie";
 
+import "highlight.js/styles/atom-one-light.css";
+import "highlight.js/lib/common";
+import hljsVuePlugin from "@highlightjs/vue-plugin";
+
 import ElementPlus from "element-plus";
 import locale from "element-plus/lib/locale/lang/zh-cn"; // 中文语言
 import "@/assets/styles/index.scss"; // global css
@@ -70,6 +74,7 @@ app.use(router);
 app.use(store);
 app.use(plugins);
 app.use(elementIcons);
+app.use(hljsVuePlugin);
 app.component("svg-icon", SvgIcon);
 
 directive(app);

src/views/tool/gen/index.vue

@@ -205,7 +205,7 @@
             style="float: right"
             > 复制
           </el-link>
-          <pre>{{ value }}</pre>
+          <highlightjs :code="value"></highlightjs>
         </el-tab-pane>
       </el-tabs>
     </el-dialog>