美文网首页
资源处理流程

资源处理流程

作者: 湘兰沅芷 | 来源:发表于2021-04-01 15:56 被阅读0次

    指定一个或多个入口( entry),也就是告诉 Webpack具体从源码目录下的哪个文件开始打包。
    如果把工程中各个模块的依赖关系当 作一棵树,那么入口就是这棵依赖树的根。
    这些存在依赖关系的模块会在打包时被封装为一个chunk。
    chunk字面的意思是代码块,在Webpack中可以理解成被抽象和包装过后的一些模块。它就像一个装着很多文件的文件袋,里面的文件就是各个模块,Webpack在外面加 了一层包裹,从而形成了chunk。根据具体配置不同,一个工程打包时可能会产生一个
    或多个chunk。
    Webpack会从入口文件开始检索,并将具有依赖关系的模 块生成一棵依赖树,最终得到一个chunk。由这个chunk得到的打包产物我们一般称之 为 bundle。entry、chunk、bundle 的关系如图


    entry. chunk、bundle 的关系.jpg

    在工程中可以定义多个入口,每一个入口都会产生一个结果资源。比如我们工程中 有两个入口 src/index.js 和 src/lib.js,在一般情形下会打包生成 dist/index.js 和 dist/lib.js, 因此可以说,entry与bundle存在着对应关系


    entry与bundle的对应关系.png
    在一些特殊情况下,一个入口也可能产生多个chunk并最终生成多个bundle

    相关文章

      网友评论

          本文标题:资源处理流程

          本文链接:https://www.haomeiwen.com/subject/bamtkltx.html