V2EX = way to explore
V2EX 是一个关于分享和探索的地方
Sign Up Now
For Existing Member  Sign In
zhoudaiyu
V2EX  ›  Vue.js

有没有类似于 Git 的性能还可以的基于 Vue 的文本对比工具?

  •  
  •   zhoudaiyu ·
    PRO
    · Aug 25, 2019 · 7899 views
    This topic created in 2437 days ago, the information mentioned may be changed or developed.

    需求是在提交前想对比当前文本和历史文本的差别( nginx 的配置文件 nginx.conf,大概以后能有一千多行吧),并把差别展示出来,就像 git commit 的时候那样。目前看有 code-diff ( https://github.com/ddchef/vue-code-diff) 和 codemirror ( https://codemirror.net/) 这两个,前者有人在 issues 里说到了大概到 2000 行的时候就会卡死;后者貌似挺老的了,不知道和 Vue 配合起来用有没有什么坑。大佬们有没有什么好的文本对比工具推荐?

    22 replies    2019-08-26 09:22:26 +08:00
    Rheinmetal
        1
    Rheinmetal  
       Aug 25, 2019
    git diff 不够用嘛?
    hronro
        2
    hronro  
       Aug 25, 2019
    系统内置的 diff 不行?
    或者可以试试这个: https://github.com/so-fancy/diff-so-fancy
    zhoudaiyu
        3
    zhoudaiyu  
    OP
    PRO
       Aug 25, 2019
    @Rheinmetal
    @hronro
    感谢回复。是想把对比结果展示在页面里。
    seki
        4
    seki  
       Aug 25, 2019
    monaco editor 有 diff 模式
    luozic
        5
    luozic  
       Aug 25, 2019 via iPhone
    对比结果展示在页面? code review 工具?
    zhoudaiyu
        6
    zhoudaiyu  
    OP
    PRO
       Aug 25, 2019
    @luozic 类似这种
    arrow8899
        7
    arrow8899  
       Aug 25, 2019
    diff2html 可以把 git diff 结果转换成 html 展示;或者是用 google-diff-match-patch 也有 js 版的
    otakustay
        8
    otakustay  
       Aug 25, 2019
    我有个 react 版本的,性能和功能方面都基本完善了,mozilla 也在用,要不用 vuera 套一下用吧
    https://github.com/otakustay/react-diff-view
    arrow8899
        9
    arrow8899  
       Aug 25, 2019
    顺便说下,文本 diff 本来就很耗 CPU,量大了自然就卡,所以一般是在后端 diff,然后交给前端渲染;
    也可以直接用 bitbucket 等商业版的,用户较少时可以免费使用。
    liangkang1436
        10
    liangkang1436  
       Aug 25, 2019 via Android
    idea 自带的 diff 不够用吗?
    duan602728596
        11
    duan602728596  
       Aug 25, 2019 via iPhone
    我还真就写过一个,是 react 版本的
    Takamine
        12
    Takamine  
       Aug 25, 2019
    Beyond Compare。
    JimmyTinsley
        13
    JimmyTinsley  
       Aug 25, 2019
    phabricator
    zhoudaiyu
        14
    zhoudaiyu  
    OP
    PRO
       Aug 25, 2019
    @Takamine
    @liangkang1436
    是要在前端展示对比结果的
    XiaoxiaoPu
        15
    XiaoxiaoPu  
       Aug 25, 2019
    写一个后端服务专门用来做 diff 嘛,前端只用来展示。看下 github.com/ddchef/vue-code-diff 的源码就知道他其实是用 www.npmjs.com/package/diff 这个库生成 diff 结果,量大的话自然会卡,把这部分用后端实现就没问题了。
    zhoudaiyu
        16
    zhoudaiyu  
    OP
    PRO
       Aug 25, 2019
    @XiaoxiaoPu 后端实现的话,有啥好用的 pip 包吗
    XiaoxiaoPu
        17
    XiaoxiaoPu  
       Aug 25, 2019   ❤️ 1
    @zhoudaiyu 后端是 python ?那直接用标准库 difflib 就行了
    Heanes
        18
    Heanes  
       Aug 25, 2019
    我也有类似需求,Mark
    weixiangzhe
        19
    weixiangzhe  
       Aug 25, 2019 via iPhone
    color diff 吧
    xy2401
        20
    xy2401  
       Aug 26, 2019
    vscode ( monaco ) 可以网页 上对比两个文本
    [Monaco Editor]( https://microsoft.github.io/monaco-editor/)

    Diff Editor
    Side by side live comparison

    Supports all languages out of the box
    zhjie
        21
    zhjie  
       Aug 26, 2019
    战略性马克
    zhjie
        22
    zhjie  
       Aug 26, 2019
    回了才记起有加入收藏...
    About   ·   Help   ·   Advertise   ·   Blog   ·   API   ·   FAQ   ·   Solana   ·   1298 Online   Highest 6679   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 119ms · UTC 17:26 · PVG 01:26 · LAX 10:26 · JFK 13:26
    ♥ Do have faith in what you're doing.