diff --git a/ruoyi-ui/package.json b/ruoyi-ui/package.json index 6f07a95..08fe86c 100644 --- a/ruoyi-ui/package.json +++ b/ruoyi-ui/package.json @@ -44,7 +44,7 @@ "element-ui": "2.14.1", "file-saver": "2.0.4", "fuse.js": "6.4.3", - "highlight.js": "10.4.1", + "highlight.js": "9.18.5", "js-beautify": "1.13.0", "js-cookie": "2.2.1", "jsencrypt": "3.0.0-rc.1", @@ -69,8 +69,8 @@ "eslint": "7.15.0", "eslint-plugin-vue": "7.2.0", "lint-staged": "10.5.3", - "sass": "1.30.0", "runjs": "4.4.2", + "sass": "1.32.0", "sass-loader": "10.1.0", "script-ext-html-webpack-plugin": "2.1.5", "svg-sprite-loader": "5.1.1", diff --git a/ruoyi-ui/src/components/HeaderSearch/index.vue b/ruoyi-ui/src/components/HeaderSearch/index.vue index b2533f3..ae952a9 100644 --- a/ruoyi-ui/src/components/HeaderSearch/index.vue +++ b/ruoyi-ui/src/components/HeaderSearch/index.vue @@ -20,7 +20,7 @@ <script> // fuse is a lightweight fuzzy-search module // make search results more in line with expectations -import Fuse from 'fuse.js' +import Fuse from 'fuse.js/dist/fuse.min.js' import path from 'path' export default { diff --git a/ruoyi-ui/src/main.js b/ruoyi-ui/src/main.js index f8f3980..82f8806 100644 --- a/ruoyi-ui/src/main.js +++ b/ruoyi-ui/src/main.js @@ -20,9 +20,6 @@ import { parseTime, resetForm, addDateRange, selectDictLabel, selectDictLabels, import Pagination from "@/components/Pagination"; // 自定义表格工具扩展 import RightToolbar from "@/components/RightToolbar" -// 代码高亮插件 -import hljs from 'highlight.js' -import 'highlight.js/styles/github-gist.css' // 全局方法挂载 Vue.prototype.getDicts = getDicts @@ -52,7 +49,6 @@ Vue.component('Pagination', Pagination) Vue.component('RightToolbar', RightToolbar) Vue.use(permission) -Vue.use(hljs.vuePlugin); /** * If you don't want to use mock-server diff --git a/ruoyi-ui/src/views/tool/gen/index.vue b/ruoyi-ui/src/views/tool/gen/index.vue index bce449e..9557a92 100644 --- a/ruoyi-ui/src/views/tool/gen/index.vue +++ b/ruoyi-ui/src/views/tool/gen/index.vue @@ -169,7 +169,7 @@ :name="key.substring(key.lastIndexOf('/')+1,key.indexOf('.vm'))" :key="key" > - <highlightjs autodetect :code="value" /> + <pre><code class="hljs" v-html="highlightedCode(value, key)"></code></pre> </el-tab-pane> </el-tabs> </el-dialog> @@ -181,6 +181,14 @@ import { listTable, previewTable, delTable, genCode, synchDb } from "@/api/tool/gen"; import importTable from "./importTable"; import { downLoadZip } from "@/utils/zipdownload"; +import hljs from "highlight.js/lib/highlight"; +import "highlight.js/styles/github-gist.css"; +hljs.registerLanguage("java", require("highlight.js/lib/languages/java")); +hljs.registerLanguage("xml", require("highlight.js/lib/languages/xml")); +hljs.registerLanguage("html", require("highlight.js/lib/languages/xml")); +hljs.registerLanguage("vue", require("highlight.js/lib/languages/xml")); +hljs.registerLanguage("javascript", require("highlight.js/lib/languages/javascript")); +hljs.registerLanguage("sql", require("highlight.js/lib/languages/sql")); export default { name: "Gen", @@ -294,6 +302,13 @@ export default { this.preview.open = true; }); }, + /** 高亮显示 */ + highlightedCode(code, key) { + const vmName = key.substring(key.lastIndexOf("/") + 1, key.indexOf(".vm")); + var language = vmName.substring(vmName.indexOf(".") + 1, vmName.length); + const result = hljs.highlight(language, code || "", true); + return result.value || ' '; + }, // 多选框选中数据 handleSelectionChange(selection) { this.ids = selection.map(item => item.tableId);