当前位置： 移动技术网 > IT编程>网页制作>CSS > 关于webpack打包报错Chunk.entrypoints:UseChunks.groupsIterableandfilterbyinstanceofEntrypointinstead的解决办法

关于webpack打包报错Chunk.entrypoints:UseChunks.groupsIterableandfilterbyinstanceofEntrypointinstead的解决办法

2019年04月30日  | 移动技术网IT编程  | 我要评论

webpack打包环境优化的一个点：将css样式代码抽离出来。

若不抽离，可以在bundle.js中发现css代码被转化成节点样式插入到了body下；这个过程是：style-loader将外部css文件注入到html中，css内容使用css-loader进行解析，转化成js文件；因为webpack只能识别js文件。

css分离：

使用extract-text-webpack-plugin插件，该插件的主要是为了抽离css样式,防止将样式打包在js中引起页面样式加载错乱的现象。

优点

非js文件单独打包，通过js将文件写入，可以用来单独做缓存。

目前工程中大部分用到的还是webpack3+；实际中，在不指定版本的情况下，npm默认安装的4.0.0版本，这时使用上述插件会报错：

error: chunk.entrypoints: use chunks.groupsiterable and filter by instanceof entrypoint instead

原因：

extract-text-webpack-plugin还不能支持webpack4.0.0以上的版本。

解决办法：

npm install –save-dev extract-text-webpack-plugin@next

会下载到+ extract-text-webpack-plugin@4.0.0-beta.0

然后在打包就正常了

您可能感兴趣的文章:

如对本文有疑问， 点击进行留言回复！！

相关文章:

验证码：
最近更新的文章
大家感兴趣的文章
移动技术网