30-尚硅谷-webpack从入门到精通-dll

的是这个技术啊。第二呢，叫做动态连接库啊，它呢类似于externs一样，会只是we pack呢，哪些库呢，是不参与打包的。那么不同的是呢，第二呢，会单独的对某些库呢进行单独打包，将多个库呢打包成一个窗口啊。那么它有什么意义呢？其实就在于啊，就是我们正常情况下呢，我们说nots里面啊，所有的包呢，它会被打包成一个窗口S啊。打包成一个文件。因为我们之前做我们代代码分割嘛，会打包成一个文件。但是呢，我们的这些第三方户呢，又非常非常多，如果全部打包成一个文件啊，这样这文件体积太大了。所以通过这个技术呢，我们可以啊，将这些库呢，给单独拆开来，打包成一些不同的一些文件啊，就打包成不同的串。这样呢，更加有利于我们的性能优化。那么废话少说，我们来说一遍，来看一下它效果，最后呢，再看一下第到底有什么用途。

我们打开啊，好，来找到这个内容，这个零四复制一份啊，我们再来一个。角28。嗯，它呢，简单来讲就是可以对我们的代码呢，进行单独打包。那么要单独打包的话呢，我们得写另外一个配置文件，所以我们再新建个文件叫VIPa.do DS。这个配置文件呢，你叫啥名都其实都行啊，只不过呢，刚好我们用上deal这个技术，所以我叫deal。好，这里面怎么写呢？我们来一点写。向外暴露出去一个对象啊，一样的。也是写，那么我们要做的事就是在这里对某些库呢进行单独打包啊，企业制造。使用技术啊，对某些。进行弹打包。那么这些某些库呢？一般指的是第三方的库。

比方说。进单打包啊，那么我们这里以这块为例去打包。所以entry呢，我要打包的这个库的最终的name叫jary，而这库呢，也叫RY了。这个意思呢，代表啊这个库最终打包的这个name。生。Name。它值是正瑞。后面我们会看到这个name呢，可以通过这个值去用啊是。后面是个数组啊，数组里面对吧，这个的意思代表里面ary。要打包的库。是啊。因为是数组，所以如果你将来有跟整块类似的一些库呢，都可以放在这里面，都可以进行打包的啊，当然咱们这一个为例。好，然后第二个呢，指定输出。

Output。有个file name。嗯。好的，输出的呢，诶这里写name啊。这里的name呢，它取的值呢，就是我这个号的名字啊。然后呢，减减S，那么就够了。好，这是打包的一个库的名称啊，然后第二个呢，就是我们要指定它的一个输出的目录。好pass呢，这里面呢，当然要用绝对路径，所以我们得引入一个方法。来自于我们的pass模块的一个方法叫。好，通过resource来拼接成我们的绝对路径杠杆，点name啊好，这里面呢，我们打算打不到这个第这个目录下。我们所有的这些单独打包的库啊，都放在这第二下就够了。那么最后啊，还加上一个我们之前没有写过的配置，叫做。Library什么意思呢？就是这个库啊。

这是我们打包的货。里面向外暴露出去的内容。叫什么名字？就这个我们呢，比方说可以给后面加个哈希值啊，这样呢，能够保证每次打包的值啊，它是不一样的啊叫哈希值。哈值呢，哎，你可以取，比如说取十位啊，取八位都行啊，我们就写个哈气值就好了。那么这里面呢，它向外库的名字就会加上JA，加上我们打包生成的这个哈西值，组合成这个内容。所以啊，你就不能通过简简单单的一个query去拿到这里面内容，而且还是加上哈希值才行啊。好，然后呢，我们还要接着写写个插件。好，这样呢，能够将整框里呢进行单独打包好。但是呢，我们需要建立起一个依赖关系，需要告诉外派，哎，将来我在打包的时候不要再打包这了，那这时候要接触个插件来生成一个文件啊。好，这插件呢，是派自带的，所以我们只要引入派就够了。

好，引入ipad这插件呢，我们来看怎么用啊。又一个派点一个deal。在里面传一些参数啊，这个name呢。我们和前面的是一样的哈希值这样呢，就大家就很清楚了啊。好，这个指示的就是我们映射的。映射这个库的。库的这个暴露的名称，暴露的内容是什么？我们最这个库输哪这个文哪所要指定。好，这里呢，也是说到deal，那么名字呢，叫。这是叔叔的名称。

好，大家知道这个第二种插件，注意啊，前面这两个配置就是专门用来打包这个纸瑞的。同时暴露的名称呢，是加上哈希值。而这个插件的作用呢，它是帮我们啊创建一个。打包生成一个。Manifest文件。那么这个文件呢，提供一个映射关系。的映射关系。那么接下来呢，我通过这个映射呢，就能知道，哦，原来我这这个库呢，不需要打包，并且呢，这里面的这个报的内容呢，是这个名称。就可以了啊，就可以了，所以我需要设置一个这个文件啊。然后呢，通过一个模式生产模式。就好了。好，那么这个配置呢，就写完了。一旦我运行这个配置，它就会对这个库呢进行单独打包，同时会生成一个manifest address文件，提供和我这个单独打包的这个库呢的影射关系。

好，这里面要注意啊，我们现在库名呢，叫做派DS啊。当你去运行运行指定的的时候。默认查找的，查找的是配置文件。所以要注意，而我们现在需求是什么呢？需要运行的是这个PE点。啊，文件。对。杠杆指定。这意思是告诉外派，哎，我们的配置文件改了，是这个one pack dl d GS，你不要再运行这个con d GS了，你运行这个DLDGS。所以我们来看效果啊。当我们预习这个指令的时候，那么这个整个配置就会启动。上面两个配置，它会将jary打包进来，并且输出出去。

同时呢，瑞这个库里面包的内容呢，是会瑞加哈西值。而下面的插件呢，会生成一个manifest文件，它里面呢会建立起这的一个映射关系。好了，那我们来看效果啊，来运行一下就就能知道他到底做哪些事了。本题要注意啊，切记预习指定要改一下。好，输出结果出来了，我们来看一下第下面有哪两个文件啊，一个叫JS，因为我这里输出的名叫name JS没问题。一个叫manifest，诶，因为我这路径的写的这个名字也没问题。我们先看整块。大家可以看啊，这呢这里呢，就挖了个这瑞，这个这会瑞呢，后面跟了一个哈希值啊，而这个哈希值呢，哎，其实是跟我打包的，这个哈希值是对应上的。好，为什么叫这个呢？诶就跟这里对应上，因为我们通过这个library指定了打包库的名称啊，就叫这个名字是JA加上哈西制成。

好，Manifest文件呢，更别说了，它就是建立起这个映射关系啊，这个整合率都不用打包了，哎，它引入的内容呢，是这个名称，建立起一个这样的名字。OK，好，那么当我们使用这个deal做完之后呢，诶将来啊这呢，就不用再打包了，因为我已经打包过了。将来呢，我的源代码呢，就只要引入这块直接用就行了，就不用再打包了。那怎么办呢？那么配置呢，也得稍微改一下啊，也得稍微改一下。好，这里呢，也得引入插件啊，也得插件。来。同样的来自于。前面这注释我都删掉了啊。好，这差距要干嘛呢？我们来看啊。又一个。插件。也也是第二种插件啊，只不过是reference。这里要传一个数啊，就是。好，同样的传路径呢，去下面找这个man。

啊，那你看这是。好什么意思呢，这个文件啊，这个文件就是啊告诉我。哪些库啊？不参与打包。哪些不参与打包啊，同时啊引入。啊，从使用时，使用时。的名称也得改。就是这个。所以啊，当我们运行这个pack，启动这个pack的时候呢，我们来看啊，我们看一下这个。我们故意去引入from。好，正常情况下呢，它是要打包的啊。我们正常情况下，我们把这个注释掉。可以看效果啊，这行ipad。

它呢，生成的大小呢，大概为300多KB啊，300多KB，当然我们环境也调production production可能更清楚一点，我们再预习一次。好，它大小的87KB啊，我们可以看一下这里面的pds呢，肯定是引入了这些内容，引入了这个呃。那么我们啊，只要加上这个插件，那么它就不会打包jary了，因为他会去找这个manifest文件，发现呢，他告诉我，诶jary不用打包，所以我们再看啊，大家会知道哦，原来我整合不用打包了。你看现在打包的体积就变得很小了，只有1KB左右。所以呢，加上这个文件呢，加上这个配置呢，它就不会再重复打包这。但是不打包货率，你会发现我指货率就没有啊，怎么办呢，对吧。这时候我们还需要使用插件，那这个插件呢，需要下载了啊。好，就是前面我下过的一次啊，叫做ADDH的插件。

那么这个插件有什么用呢？我们来解释一下啊。好，我们来说一下这个茶几干嘛用的？么这个需要。这个条件呢，就是啊引入。会将。某个文件啊，打包输出去。并在HM中。该文件。然后它会自动引入这个资源，并且呢会把它打包出去，而我们要填写的一个内容啊，就叫fire pass。啊值呢，也是一个啊一个啊。

那么我们要做什么事呢？就是我们之前这个这个啊，它引进引进输，同时它会在HL中引进来。你看我们现在输出的HL中呢，它是没有这个的，只有BS。而BJS呢，因为我们派的关系，它没有打破折。而我们加上这个插件呢，它就会自动引入我们再运行一次啊。翻译，其次，这个派执行这个派不直接死。这时候我们去看HHL它这时候就会引入这个，同时呢，会把jes呢，它会单独打包过来，打包到这来啊，打包到这来，同时我们看B层啊标层的，当然它已经压缩了。这时候我们再去运行这个HL文件的话呢，就没问题，我们来看啊。Have you。刷心哎，整合呢就没问题，完整输出了，因为呢，它引入了这个整合瑞的GS。

好，整体呢，我们来捋一下到底做了哪些事情啊，稍微的复杂一些，这个配置呢，稍微的麻烦一些啊。首先我们定义了个文件，叫pack DS。它作用呢，就是专门去单独打包某些库。比方说我们这。发送打包的时候呢，会生成一个S和一个manifest。其中GS呢，就是单独打包的，这个它的作用就是希望我将来在构建的时候呢，就不用再重复打包了，因为重复打包呢，性能更慢一些。同时呢，呃，我也要知道哪些库不用重复打包了，最多了个man，提供这些和这些库的一个映射关系啊，包括库的路径和库的内容名称。那么有这个文件生成之后呢，那么下面我们。打包的时候呢，我们就得告诉派哪些客户不参与打包。通过reference这个plug就会知道，哦，原来啊，找到这个if文件。

他原来就是知道，哎，原来我jary啊就不用打包了，那好，那所以呢，我打包的时候呢，Jary呢，就相当于不存在，虽然我们在入口文件中把jary中引进来了，他会知道原来我不要打你，忽略你。但忽略你之后呢，打包输出出去的资源啊，它是并没有折扣率的。那怎么办呢？我们再讲插件需要把我们之前输出出去的整合位呢，再单独的再引进来才行。同时呢，需要引入这个资源。那这样呢，我们在用这个整块的时候，它才不会报错啊。所以这个呢，相当于是忽略打包折扣啊，这个呢是将之前打包的负责引进来，引进来啊，必须引，因为不引入的话呢，就找不到，找不到机会报错啊。所以这个包呢，负责引进来的理。那么当然你一种方法可以手动引啊，手动写那个四数标签引进来也可以啊，当然这样的就麻烦啊，这种方式呢，就简单一些啊，就简单一些。可以用插件自动，这样方便一些啊。所以最终呢，我们要知道就是这个方法呢，只要这个不变，我们永远只要运行一次即可。

那么将来你的原代码的改动呢，你只要反复的运行这个这个文件就可以了啊。反复运行啊，原代码一改运行它，再一改再运行它，而第二呢，就不用再运行了，那么这也就意味着我们这个折扣呢，今后呢，就不用再重复的进行打包了。那么这里我们就优化了重复打包折扣这个性能。好，那么大家讲到这里呢，来说，诶好像只油画转化率好像也不明显啊。因为将来呢，我们还有很多很多户，我说了在这里可以一一写着。一些啊，所以呢，将来我们有很多很多第三方库，我们都会用第的这种方式对他进行单独打包。那么在重新打包的时候呢，我们就不需要再考虑这些第三方的库了，那么能让我们第二次打包的速度呢，能够快，而且快很多，因为少了很多第三方的库的打包。所以这就是这个必要啊。它是不彻底，不打包，它需要通过CDN连接进来。

而第二呢，它是需要打包。只不过呢，诶需要打包一次，将来呢，就不需要重复打包了，是这样的。所以呢，如果你是要通过CDN连接引入的话呢，那建议你还是使用external这种方式。但是呢，如果是现第三方的些库，哎，你需要把它们打包整合在一起，不是不是使用CDN连接，而是自己服务器相关暴露出去，那推荐你使用D2啊，是D2。好了，那么这些呢，就是对某些呢单独打包，或者说某些呢，先不参与打包，后面参与打包的一种方案。