首页   注册   登录
V2EX = way to explore
V2EX 是一个关于分享和探索的地方
现在注册
已注册用户请  登录
V2EX  ›  程序员

前端项目里没用到的文件/资源 有什么工具能检测出来吗?

  •  
  •   firhome · 36 天前 · 573 次点击
    这是一个创建于 36 天前的主题,其中的信息可能已经有所发展或是发生改变。
    比如 vue 项目里,有很多单页是项目遗留 已经没用了。一些资源图片改版也没用了。

    有没有什么工具 可以 找到这些没用到的文件 /组件 /资源呢?
    3 回复  |  直到 2019-07-17 17:34:51 +08:00
        1
    15651980765   36 天前
    我只知道 webstorm 删除项目文件的时候,如果该文件在项目中使用到了,会提示你。
    马一下,看有没有大佬解答。
        2
    arrow8899   36 天前
    拿到文件名,直接暴力遍历,检查是否包含文件名即可。。。
        3
    duan602728596   36 天前 via iPhone
    代码解决思路:

    1. 使用 glob 拿到项目中所有的文件
    2. 将所有的文件解析成绝对路径
    3. 使用 @babel/parser 将 js 文件解析成 ast 树
    4. 使用 @babel/traverse 提取 ast 树中 import 的相对路径并转换成绝对路径
    5. 对比被使用了的文件后,剩下的文件就是没有用到的,或者是入口文件,排除入口
    6. 同理,解析 css 文件可以使用 postcss
    7. 解析 vue 文件需要使用 vue-template-compiler 和 @vue/component-compiler-utils 提取出 vue 文件中的 css 和 js 代码,然后重复上面的操作

    总之,就是利用解析器将代码解析成 ast 树,提取出其中的路径,然后和所有文件进行比对
    关于   ·   FAQ   ·   API   ·   我们的愿景   ·   广告投放   ·   感谢   ·   实用小工具   ·   1255 人在线   最高记录 5043   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.3 · 18ms · UTC 17:30 · PVG 01:30 · LAX 10:30 · JFK 13:30
    ♥ Do have faith in what you're doing.