可以看到,vue-code-diff 支持类似 github 的 code diff 功能,还可以设置 diff 类型(line-by-line,side-by-side),设置差异级别等功能。一般情况已经能够满足使用,但仍有一些不足: 由于高亮代码是同步渲染。当代码较多时,渲染耗时较久,此时会阻塞 ui。如两个一百多行的文件做 diff,到页面显示完成总共需要大概 1....
GitHub - Shimada666/v-code-diff: A vue code diff display plugin, support Vue2 / Vue3 1 使用介绍 新版本努力保证了与旧版本的兼容性。因此,基础的使用也与旧版本一样,也是同时支持 vue2/3 以vue3 为例,我们要先在 main.js 里注册为全局组件 import { createApp } from 'vue' import CodeDiff ...
theme: 主题色 支持自动跟随系统色的方式 'auto', 或者手动设置 'light' | 'dark', 默认'auto' 其他属性可参考 https://github.com/rtfpessoa/diff2html#diff2html-configuration 实现效果 line-by-line 行内对比 两个窗口对比 side-by-side 夜间模式效果About...
liuyang113 Merge branch 'master' of https://github.com/JohuMid/utools_code_diff 9d8d86e· Aug 15, 2023 History8 Commits public 文本代码对比 Oct 23, 2021 src [add] 增加快捷键操作 Aug 15, 2023 theme 文本代码对比 Oct 23, 2021 utools [add] 增加快捷键操作 Aug 15, 2023 .gitignore [add...
前面两篇文章聊到为什么code diff、在哪个环节执行,接下来咱们来聊一聊code diff使用到的工具。经常使用的工具有:git、BeyondCompare、InteliJ IDEA(简称IDEA)、gitlab/github等。下面介绍一下这几个工具如何使用(本文使用的工具是以Java语言code diff为例)。
diffStyle每行中对比差异级别stringword, charword fileName文件名string- isShowNoChange当无对比时展示源代码boolean-false 效果展示 line-by-line side-by-side LICENSE MIT Install npm ivue-code-diff Repository github.com/ddchef/vue-code-diff
<script src="https://cdn.jsdelivr.net/npm/vue-code-diff@1.2.0/dist/vue-code-diff.min.js"></script> Learn more vue-code-diff 代码比对展示demo 安装 yarn add vue-code-diff 使用 <template> <div> <code-diff :old-string="oldStr" :new-string="newStr" :context="10" /> </div> <...
参考vue-code-diff (https://github.com/ddchef/vue-code-diff) 实现了git diff内容的格式化显示 使用了highlight.js插件 使用了diff2html的插件 The MIT License (MIT) Copyright (c) 2018 Visual.Hu Permission is hereby granted, free of charge, to any person obtaining a copy of this software and...
Github Code Diff Contents Install Getting started Vue3 Vue2 Props Events Demo Extend languages Migrate from 0.x version Install installv-code-diff #npmnpm i v-code-diff#yarnyarn add v-code-diff#pnpmpnpm add v-code-diff Vue2.6 developers need install composition-api ...
为此，我基于vue-code-diff开发了v-code-diff，使其支持vue2和vue3，提升了渲染性能，并添加了异步渲染、渲染前后钩子等新特性。vue-code-diff的核心功能包括github风格的代码对比和差异级别设置，但存在安全依赖（highlight.js 9版本已废弃）、样式和兼容性问题，以及缺乏高级回调和vue3支持。v-code-...