youcanwin8099
V2EX  ›  Vue.js

vue 项目,如果新建了一个文件, 但是后来不用了,但是没有去删掉它,如果这样的文件越来越多,会不会整个工程打包的速度会变慢?

  •  
  •   youcanwin8099 · Apr 16, 2020 · 3743 views
    This topic created in 2230 days ago, the information mentioned may be changed or developed.
    14 replies    2020-04-20 08:56:04 +08:00
    SunriseFox
        1
    SunriseFox  
       Apr 16, 2020
    不会,没有引用的文件不会被打包
    youcanwin8099
        2
    youcanwin8099  
    OP
       Apr 17, 2020
    @SunriseFox 引用一般是用什么语句引用进来?不好意思,初学 vue.
    mazai
        3
    mazai  
       Apr 17, 2020
    @youcanwin8099 nodejs 的 package.json 会有依赖
    youcanwin8099
        4
    youcanwin8099  
    OP
       Apr 17, 2020
    @mazai 但是我写的文件只是一个普通的 vue,谈不上什么组件,不会在 package.json 里定义。
    SunriseFox
        5
    SunriseFox  
       Apr 17, 2020 via Android
    @youcanwin8099 import 或者 require
    youcanwin8099
        6
    youcanwin8099  
    OP
       Apr 17, 2020
    @SunriseFox 比如我
    import departWindow from './DepartWindow',
    但是我页面里,没有在做任何关于这个 DepartWindow 的事情,那么是不是如果不删掉这个引用,同时也不删掉这个 DepartWindow.vue,那么项目会越来越大?打包越来越慢?
    SunriseFox
        7
    SunriseFox  
       Apr 17, 2020
    youcanwin8099
        8
    youcanwin8099  
    OP
       Apr 17, 2020
    @SunriseFox 哎!那从某种意义上讲,vue 这种东西,就不适合快速迭代。
    SunriseFox
        9
    SunriseFox  
       Apr 17, 2020
    @youcanwin8099 这个其实和 vue 没关系的,而是和 webpack 配置有关系。webpack 可以配置一些 tree shaking 的办法可以帮助移除这些没有引用的代码来减少项目体积(但是会极大地减慢打包速度);为了防止这些没有用到的引用,有 eslint 这样的工具帮忙查找定位,如果需要的话也可以借助工具在打包时自动移除。
    jrtzxh020
        10
    jrtzxh020  
       Apr 17, 2020 via iPhone
    @youcanwin8099 使用 eslint 可以避免出现这种问题
    youcanwin8099
        11
    youcanwin8099  
    OP
       Apr 17, 2020
    “减少了项目体积“,”但是会极大地减慢打包速度?”
    使用 eslint 时,应该只是不打包它,但是不会物理删除这个 DepartWindow.vue 吧?
    ljwrer
        12
    ljwrer  
       Apr 17, 2020
    如果使用了 async import 可能会索引到,减慢打包速度
    SilentDepth
        13
    SilentDepth  
       Apr 17, 2020
    以 Webpack 为例,build 时它会从入口模块开始一个个分析 require/import 语句,被引用到的模块会被纳入构建分析范围,这里是会影响构建速度的。

    如果你在某个被引用的模块里 import 了 DepartWindow.vue ,那么它就被纳入构建分析范围,理论上会增加构建耗时。至于影响多大,取决于模块体积(比如代码内容越多分析过程越长)、构建优化手段(比如可以直接静态分析 vue 模块就不需要 vue-loader 工作了)。

    ESLint 可以在开发阶段提示未被实际使用的依赖。如果可能,最好在一开始就移除这些未使用依赖。但实际地说,除非这种情况非常多,或者文件内容非常大,通常对构建性能没有太大影响。
    zhwithsweet
        14
    zhwithsweet  
       Apr 20, 2020
    @youcanwin8099 #11 那肯定啊,假如一个框架不经过你的允许,就自动删除你的文件。你敢用吗?
    About   ·   Help   ·   Advertise   ·   Blog   ·   API   ·   FAQ   ·   Solana   ·   3329 Online   Highest 6679   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 46ms · UTC 11:07 · PVG 19:07 · LAX 04:07 · JFK 07:07
    ♥ Do have faith in what you're doing.