异常描述:

复用以前框架,打包的时候报异常提示:

 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的更多相关文章

  1. Vue -- vue-cli webpack打包开启Gzip 报错

    前两天项目上线,用vue-cli npm run build命令打包,打包完成后我擦吓了一跳,15M.本来暂时不打算优化的,但是每次看着部署包这么大,想想还是先优化一下,让包好看点,免得以后出现心理阴 ...

  2. vue 使用webpack打包后路径报错以及 alias 的使用

    一.vue 使用webpack打包后路径报错(两步解决) 1. config文件夹 ==> index.js ==> 把assetsPublicPath的 '/ '改为 './' 2. b ...

  3. webpack打包字体图标报错的解决办法

    webpack打包字体图标需要两个加载器  url-loader 和 file-loader 另外  字体图标的引入方式  本来应该是  url("....") 这样的方式,但是w ...

  4. Vue+webpack项目中,运行报错Cannot find module 'chalk'的处理

    刚开始用vue + webpack新建项目,在github上下载了一个示例,输入npm init >>>npm run dev 后报错 Cannot find module 'cha ...

  5. nodejs+react使用webpack打包时控制台报错

    一.错误:Uncaught ReferenceError: process is not defined 解决方法: new webpack.DefinePlugin({ 'process.env': ...

  6. Nuxt.js vue init nuxt-community/koa-template 初始化项目报错

    报错提示: Module build failed: Error: Plugin/Preset files are not allowed to export objects, only functi ...

  7. PHP开启页面报错的代码

    PHP开启页面报错的方法很简单,在<?php内加入下面的代码就可以了: <?php ini_set("display_errors", "On"); ...

  8. pyinstaller打包多个py文件仍报错ModuleNotFoundError: No module named 'xxx'

    [问题现象] 使用pyinstaller A.py -p b.py -p c.py打包多个文件 或者使用main.spec在Analysis配置好各个文件打包 打包成功后,运行main.exe仍然报错 ...

  9. vue cli 3 打包过大问题

    vue cli 3 打包命令 npm run build,这种情况下的打包可以通过设置 vue.config.js里面的 productionSourceMap: false. 如果是自己设置的打包环 ...

随机推荐

  1. flask启动找不到路由问题

    解决方法

  2. linux下apache和tomcat整合

    一 Apache与Tomcat比较联系 apache支持静态页,tomcat支持动态的,比如servlet等. 一般使用apache+tomcat的话,apache只是作为一个转发,对jsp的处理是由 ...

  3. css透明度、毛玻璃效果

    透明度: 1.opacity    背景颜色和字体同时透明 2.background:rgba(255,255,255,0.2);   只是背景颜色透明,字体不透明 代码: .info{ backgr ...

  4. 【Spring Boot】Spring Boot之利用Logstash将日志转换成以JSON的格式存储和输出

    一.Logstash的作用 Logstash是一个完全开源的工具,它可以对日志进行收集.过滤,能非常方便地将日志转换成以JSON的格式存储和输出,并将其存储供以后使用. 二.整合Logstash的步骤 ...

  5. linux命令当前文件夹下面模糊搜索文件

    在当前文件夹下面模糊搜索文件: find . -type f | xargs grep 'boot',"boot"表示文件名中包含的字符串

  6. Python 函数返回值类型

    [ i for i in dir(set) if not i.startswith('_') ]   

  7. Httpd服务入门知识-Httpd服务常见配置案例之基于用户账号实现访问控制

    Httpd服务入门知识-Httpd服务常见配置案例之基于用户账号实现访问控制 作者:尹正杰 版权声明:原创作品,谢绝转载!否则将追究法律责任. 一.基于用户的访问控制概述 认证质询: WWW-Auth ...

  8. Android Studio Gradle 配置问题

    中国境内可以直接访问 dl.google.com 不会被墙. 由于种种原因导致的Gradle出现各类型配置问题在各大论坛.提问区已经是新人常问的问题了,自己也遇到很恶心的几个问题: Valid cer ...

  9. linux启动介绍

    1. linux内核3.0之前,使用init(初始化 )进程管理的启动程序.一旦升级到3.0(centos7)使用systemd的方式进行管理. 2. 启动模式:启动后执行哪些典型的操作.vi/etc ...

  10. mysql分析sql语句基础工具 -- explain

    分析sql语句 explain explain (sql语句) G; 分析结果: id sql语句编号如果是连接查询,表之间是平等关系,编号相同:如果有子查询,编号递增. select——type 查 ...