垫片,它解决的场景有哪些呢,举个例子,当你再使用第三方库,此时需要引入它,又或者是你有很多的第三方库或者是自己写的库,每个js文件都需要依赖它,让人很繁琐,这个时候,shimming就派上用场了。
需要使用 ProvidePlugin 插件,这个webpack是内置的,shimming依赖的就是这个插件。
使用 ProvidePlugin 后,能够在通过 webpack 编译的每个模块中,通过访问一个变量来获取到 package 包。
new webpack.ProvidePlugin({// 这里设置的就是你相应的规则了// 等价于在你使用lodash模块中语句👇// import _ from 'lodash'_: 'lodash'})
如下:
// array_add.jsexport const Arr_add = arr=>{let str = _.join(arr,'++');return str;}
这样子没有正常导入lodash库的话,是会报错的,但是我们使用了ProvidePlugin插件,使得它会提供相应的lodash包,注意到的就是,避免多个lodash包被打包多次,可以使用CommonsChunkPlugin插件,webpack4已经抛弃它了,使用的是splitChunksPlugin插件取代它
