爱意满满的作品展示区。
zhlx

开源了一款开发提效工具—点击页面 dom 自动把鼠标定位到 IDE 源代码位置(支持 vite/webpack/rspack,支持 vue2/vue3/react/preact/solid)

  •  3
     
  •   zhlx · Dec 27, 2023 · 4073 views
    This topic created in 1053 days ago, the information mentioned may be changed or developed.

    效果可以看下面的图片: code-inspector

    这是项目地址:code-inspector

    你也可以快速体验在线的 demo:

    欢迎大家体验,希望对大家有所帮助

    25 replies  •  2024-12-19 18:17:55 +08:00
    zcf0508
    zcf0508
    Dec 27, 2023 via Android
    1
    非常好用!
    sorude
    sorude
    Dec 27, 2023
    2
    感觉有点东西,但是没想到一定要这样做的场景👍
    zhlx
    zhlx
    OP
    Dec 27, 2023
    3
    @zcf0508 哈哈哈,在这遇到老哥了,离不开你的开发支持
    zhlx
    zhlx
    OP
    Dec 27, 2023
    4
    @sorude 开发时候用,对于大项目文件层级深、文件数量多,或者接收新项目的场景,要查找页面组件的源码文件是很麻烦的。用这个插件可以一键定位
    sorude
    sorude
    Dec 27, 2023
    5
    @zhlx #4 体验一发 点了个小星星
    SaltedFish12138
    SaltedFish12138
    Dec 27, 2023
    6
    **我愿称之为今年最好用插件**
    (拜当前项目所赐, 几百个页面,vue 名称混乱、url 配置乱七八糟、页面嵌套错综复杂,找一个页面都要累死,)
    xudashan
    xudashan
    Dec 27, 2023
    7
    牛牛牛!感谢感谢!
    zhangkun28273455
    zhangkun28273455
    Dec 27, 2023
    8
    使用了一下,确实很方便👍
    MangoCloud
    MangoCloud
    Dec 27, 2023 via Android
    9
    原理是啥
    Natsuno
    Natsuno
    Dec 27, 2023
    10
    已安装👍
    zhlx
    zhlx
    OP
    Dec 27, 2023
    11
    @MangoCloud 可以看我这篇掘金的文章,有讲大致原理: https://juejin.cn/post/7288238328381587475
    paopjian
    paopjian
    Dec 27, 2023
    12
    有没有不用 npm 工具安装的方法呢?项目在网络隔离环境里,安装挺麻烦的,可不可以直接 idea 插件这种?
    xiaoxinshiwo
    xiaoxinshiwo
    Dec 27, 2023
    13
    牛的,已经 star
    zhlx
    zhlx
    OP
    Dec 27, 2023❤️1
    14
    @paopjian 暂时不行,因为插件的能力实现上需要参与到项目的编译过程,所以需要和 vite/webpack/rspack 等打包工具结合使用,单纯的 IDE 插件无法参与到打包过程中
    chf007
    chf007
    Dec 27, 2023
    15
    哈哈,有想到一块去了。不过你这个只是想快速找到要修改的地方。我之前有想要搞个这个东西,主要出发点是有些文案上线后,总有产品、运营或老板看到后想要变一下。有了这个东西后就可以让想改的人直接定位到相关代码行,让他们自已改(直接打开 gitlab 编辑器或开个云编辑器),然后保存自动生成合并请求,我只要审一下代码通过一下走流水线发布就行了。
    zhaol
    zhaol
    Dec 27, 2023
    16
    之前试过一个叫 LocaltorJs 的浏览器插件,也是类似功能,但是定位好像不准,就没用了
    zhaol
    zhaol
    Dec 27, 2023
    17
    @zhaol 更正 LocaltorJs -> LocatorJs
    zhlx
    zhlx
    OP
    Dec 27, 2023
    18
    @zhaol 嗯嗯我也看过那个,不过他那个需要安装 npm 包 + 浏览器插件,比较麻烦。我这个只需要装一个 npm 包,定位是绝对准确的
    body007
    body007
    Dec 27, 2023
    19



    建议统一下,我用 git 仓库安装,结果配置好了报错,提示包不存在😂
    zhlx
    zhlx
    OP
    Dec 27, 2023
    20
    @body007 感谢帮忙发现问题!之前是分了 webpack 和 vite 两个包,现在统一了,没发现 readme 没改过来 QaQ
    ovos
    ovos
    Dec 27, 2023
    21
    有没有 webstorm 版本呀 大佬
    zhlx
    zhlx
    OP
    Dec 27, 2023
    22
    @ovos 支持 webstorm 的,默认只要你运行了 Webstorm 就能自动识别打开,你可以安装试试。如果不能自动识别打开,可以参照这里手动配置一下: https://inspector.fe-dev.cn/guide/ide.html
    FishBear
    FishBear
    Dec 27, 2023 via iPhone
    23
    明天试试
    cleanery
    cleanery
    Dec 28, 2023
    24
    好用, 感谢, 已 star
    zhlx
    zhlx
    OP
    Dec 19, 2024
    25
    最新版本已经支持了 cursor 和 windsurf
    About   ·   Help   ·   Advertise   ·   Blog   ·   API   ·   FAQ   ·   Privacy   ·   Solana   ·   2309 Online   Highest 6679   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 49ms · UTC 03:51 · PVG 11:51 · LAX 19:51 · JFK 22:51
    ♥ Do have faith in what you're doing.