zoukankan      html  css  js  c++  java
  • webpack源码-依赖收集

    webpack源码-依赖收集

    version:3.12.0

    程序主要流程:
    • 触发make钩子 Compilation.js
    • 执行EntryOptionPlugin 中注册的make钩子
    • 执行compilation.addEntry
    • 执行compilation._addModuleChain Compilation.js
    • 执行moduleFactory.create(this.semaphore.avaiable 初始化为100) Compilation.js
    • 执行this.buildModule Compilation.js
    • 执行this.processModuleDependencies Compilation.js
    • this.addModuleDependencies Compilation.js
    • buildModule过程中,使用acorn将代码js代码转换为ast,分析require 和 import 语句,触发对应的钩子收集相关依赖。

    require

    触发 call require:commonjs:item 钩子,在CommonJsRequireDependencyParserPlugin.js

    const dep = new CommonJsRequireDependency(param.string, param.range);
    dep.loc = expr.loc;
    dep.optional = !!parser.scope.inTry;
    parser.state.current.addDependency(dep);
    

    import

    触发 program钩子 在HarmonyImportDependencyParserPlugin.js

    const module = parser.state.module;
    const dep = new HarmonyCompatibilityDependency(module);
    dep.loc = {
       start: {
          line: -1,
          column: 0
       },
       end: {
          line: -1,
          column: 0
       },
       index: -2
    };
    module.addDependency(dep);
    

    每一个依赖(Dependency)的实体都包含一个module字段,指向被依赖的Module. 这样通过Module的dependencies数组成员就能找出该模块所依赖的其它模块。 webpack使用不同的Dependency子类,如AMDRequireDependency ,AMDDefineDependency ,AMDRequireArrayDependency,CommonJsRequireDependency,SystemImportDependency来表式不同的模块加载规范, 通过对应的DependencyParserPlugin来加载 AMD或CMD的模块。

  • 相关阅读:
    Linux安装MySQL5.7.25
    Linux配置jdk
    SpringBoot junit 测试
    SpringBoot jasypt 对配置文件项加密
    关于Hibernate级联操作的总结
    GROUP BY 和 ORDER BY一起使用时,要注意的问题!
    web.xml 中的listener、 filter、servlet 加载顺序及其详解
    Hibernate对象的生命周期(补充)
    hibernate--持久对象的生命周期介绍
    开发属于你自己的标签库!
  • 原文地址:https://www.cnblogs.com/walkermag/p/webpack-yuan-mayi-lai-shou-ji.html
Copyright © 2011-2022 走看看