vue-cli webpack打包开启Gzip 报错—— Cannot find module 'compression-webpack-plugin
异常描述:
复用以前框架,打包的时候报异常提示:
Cannot find module 'compression-webpack-plugin"
然后安装插件:
npm install --save-dev compression-webpack-plugin
重新打包,又报异常如下:
ValiDationError: Compression Plugin Invalid Options

解决问题:
经查证,系插件版本问题导致。目前这个插件版本已经到3.0.0,但是网上普遍给出的可用版本是 v1.1.12,那么先解决问题,安装低版本插件:
npm install --save-dev compression-webpack-plugin@1.1.
或者在packagejson修改版本号 "compression-webpack-plugin": "1.1.12" 直接npm install。
重新打包,问题解决。
后记:
关于为什么要把插件的版本降低,系高版本要求的node版本比较高(大部分人用的node版本都没这么高,所以就会有不少人遇到这个问题了)。详见官网:https://www.npmjs.com/package/compression-webpack-plugin。


如上,2.0版本已经需要v6.9的node以及v4.0的webpack,查看下了项目的配置:


怪不得,webpack版本太低了。那么提升下webpack版本,再将压缩插件的版本恢复到最新试试:


安装插件,重新打包,报错了:

看了下webpack的官方介绍,貌似4.0版本改动较大,应该是用法上也有很大改动吧,暂且继续使用低版本的吧,有时间再研究。
vue-cli webpack打包开启Gzip 报错—— Cannot find module 'compression-webpack-plugin的更多相关文章
- Vue -- vue-cli webpack打包开启Gzip 报错
前两天项目上线,用vue-cli npm run build命令打包,打包完成后我擦吓了一跳,15M.本来暂时不打算优化的,但是每次看着部署包这么大,想想还是先优化一下,让包好看点,免得以后出现心理阴 ...
- vue 使用webpack打包后路径报错以及 alias 的使用
一.vue 使用webpack打包后路径报错(两步解决) 1. config文件夹 ==> index.js ==> 把assetsPublicPath的 '/ '改为 './' 2. b ...
- webpack打包字体图标报错的解决办法
webpack打包字体图标需要两个加载器 url-loader 和 file-loader 另外 字体图标的引入方式 本来应该是 url("....") 这样的方式,但是w ...
- Vue+webpack项目中,运行报错Cannot find module 'chalk'的处理
刚开始用vue + webpack新建项目,在github上下载了一个示例,输入npm init >>>npm run dev 后报错 Cannot find module 'cha ...
- nodejs+react使用webpack打包时控制台报错
一.错误:Uncaught ReferenceError: process is not defined 解决方法: new webpack.DefinePlugin({ 'process.env': ...
- Nuxt.js vue init nuxt-community/koa-template 初始化项目报错
报错提示: Module build failed: Error: Plugin/Preset files are not allowed to export objects, only functi ...
- PHP开启页面报错的代码
PHP开启页面报错的方法很简单,在<?php内加入下面的代码就可以了: <?php ini_set("display_errors", "On"); ...
- pyinstaller打包多个py文件仍报错ModuleNotFoundError: No module named 'xxx'
[问题现象] 使用pyinstaller A.py -p b.py -p c.py打包多个文件 或者使用main.spec在Analysis配置好各个文件打包 打包成功后,运行main.exe仍然报错 ...
- vue cli 3 打包过大问题
vue cli 3 打包命令 npm run build,这种情况下的打包可以通过设置 vue.config.js里面的 productionSourceMap: false. 如果是自己设置的打包环 ...
随机推荐
- Django 之restfromwork 序列化组件实现数据增删查改
rest-framework序列化之Serializer models.py from django.db import models # Create your models here. class ...
- 浅谈Flask 中的 线程局部变量 request 原理
2017-11-27 17:25:11 晚橙 阅读数 600更多 分类专栏: Flask python 多线程 版权声明:本文为博主原创文章,遵循CC 4.0 BY-SA版权协议,转载请附上原文出 ...
- Dapper: How to get return value ( output value) by call stored procedure
使用Dapper 执行存储过程插入一条数据,同时返回主键 Dapper 的参数类型有以下四种 System.Data.ParameterDirection public enum ParameterD ...
- 洛谷P2495 [SDOI2011]消耗战(虚树dp)
P2495 [SDOI2011]消耗战 题目链接 题解: 虚树\(dp\)入门题吧.虚树的核心思想其实就是每次只保留关键点,因为关键点的dfs序的相对大小顺序和原来的树中结点dfs序的相对大小顺序都是 ...
- P5021 赛道修建[贪心+二分]
题目描述 C 城将要举办一系列的赛车比赛.在比赛前,需要在城内修建 mm 条赛道. C 城一共有 nn 个路口,这些路口编号为 1,2,-,n1,2,-,n,有 n-1n−1 条适合于修建赛道的双向通 ...
- python基础知识笔记-集合
集合使用花括号将元素之间用逗号隔开即可.集合的输出里不会出现相同的元素.集合中有并集.交集.差集等,以下为一些简单的表达: def main(): list1=[1,1,2,2,3,3] print( ...
- MySQL 快速删除大量数据
千万级数据量 方案1. 直接使用delete 因delete执行速度与索引量成正比,若表中索引量较多,使用delete会耗费数小时甚至数天的时间 方案2. (1)创建临时表,表结构与原表结构相同 ...
- [译] 揭秘 iOS 布局
翻译自:Demystifying iOS Layout 在你刚开始开发 iOS 应用时,最难避免或者是调试的就是和布局相关的问题.通常这种问题发生的原因就是对于 view 何时真正更新的错误理解.想理 ...
- docker 服务无法启动
重装以后仍然不行,dockerd可以运行,但是systemctl start docker.service不行,后来在编辑一个文件时,提示没有空间可以保存,结果一查,发现服务器空间基本占满了, 通过 ...
- [Schematics] 2. EJS
Schematices using EJS as template language. template: <%# This will not appear in the generated o ...