我所知道的webpack5那些不太一样的改变

,在webpack 5之前，webpack是没有提供持久化缓存，我们开发的时候需要使用类似 cache-loader 来做缓存方面的处理,在webpack 4中：,在webpack 5中,在webpack 5中自身也加入了持久化缓存，缓存生成的 webpack 模块和 chunk，来改善构建速度。cache 会在开发 模式被设置成 type: 'memory' 而且在 生产 模式 中被禁用。,这里指的就是访问web页面时的浏览器缓存，我们也知道，之前有 hash chunckhash contenthash 在 webpack 5中，把hash改成了fullhash。,首先，我们介绍一下这几个hash值有什么不一样。,hash/fullhash 是根据打包中的所有文件计算出来的 hash 值，在一次打包中，所有的资源出口文件的filename获得的[hash]都是一样的。,chunckhash顾名思义是根据打包过程中当前 chunck 计算出来的 hash 值。,contenthash顾名思义是根据打包时的内容计算出的 hash 值。,这是添加注释和修改变量后的 index.js 的内容,,我们可以看到这里的 hash 值为 e8510378c5f44d16af40 。,这里是添加注释和修改变量后打包后的结果,,
,我们可以看到这里的 hash 值为 2c719bba27df586bf8f2 。,,我们可以看到这里的 hash 值为 d1bc13ae7e7dc828a64f 。,这里是添加注释和修改变量后打包后的结果,,我们可以看到这里的 hash 值为 d1bc13ae7e7dc828a64f 。,既然webpack 4都有这个功能，那么随着webpack 5的升级，又有什么不一样的地方呢？,我们来建立一个三个文件，index.js、a.js、b.js,,
,但是我们打包出来的结果，却是连 name 也打包进去。,,简直完美秒杀。,,我们可以看到，点击按钮，成功触发onClick事件。,在 webpack 5 之前，没有内置资源模块，所以，我们通常使用，file-loader url-loader raw-loader之类的loader去处理。,当然，webpack 5的改变不止这些，比如，还有 不再为 Node.js 模块自动引用 polyfill、也内置了terser进行代码压缩......