删除node_modules文件夹后重新安装插件后执行npm run build报错问题的解决办法

这两周基于vue2.0+webpack开发了3个SPA,最开始在sublime text3中开发,文件结构如下图:

删除node_modules文件夹后重新安装插件后执行npm run build报错问题的解决办法_第1张图片

图1

       后来怕文件丢失,想着尽块备份文件夹,于是改为使用webstrom(11.0.3版本)开发,由于node_modules文件夹下插件很多,文件多,导致webstorm很卡,按照网上查到的办法webstorm卡顿问题,设置完后还是偶尔会导致电脑卡顿,我的电脑内存可是8G啊,无奈之下,于是删除了node_modules文件。webstorm马上就不卡了。工程如果需要继续调试或打包大不了执行命令:cnpm install,重新把所有依赖的插件全部再安装一遍就可以了。

       今天项目需求有变,于是我执行了命令cnpm install,所有插件都安装好了,但是当我执行npm run build时,就跳出下面的错误了:

删除node_modules文件夹后重新安装插件后执行npm run build报错问题的解决办法_第2张图片

图2


删除node_modules文件夹后重新安装插件后执行npm run build报错问题的解决办法_第3张图片

图3


       出现这个报错后,我百思不得其解,我的源码没有改变,只是把所有依赖的插件删除后重新安装了一遍,那就可以断定是插件的问题。

       解决这个问题花了我大半天的时间,下面是我解决这个问题的过程。

1.是某些插件安装失败了吗?

于是我把node_modules文件夹删除后重新执行cnpm install,发现其实是有报错的,截图如下:

删除node_modules文件夹后重新安装插件后执行npm run build报错问题的解决办法_第4张图片

图4

       然后我就开始在网上查os(darwin),发现是苹果操作系统的内核,名字是达尔文,而fsevents这个插件只支持苹果系统,后来论坛上有个帖子说其实这个插件其实已经安装好了,只是报错而已,不用管。而且我后来使用webpack重新新建工程,发现每个新建的工程都会报这个错误,说明不是这个问题。而我以前搭建好的工程,只要是 node_modules中插件没有重新安装的,执行npm run build都不会报错。那就说明有可能是插件安装版本号的问题。

在图3报错的是css-loader和vue-loader这两个插件,css-loader的版本号是0.26.4,vue-loader的版本号是11.2.0,而我以前搭建好的工程,package.json文件下插件版本号截图如下:

删除node_modules文件夹后重新安装插件后执行npm run build报错问题的解决办法_第5张图片

在这个工程中,css-loader的版本号是0.26.1,vue-loader的版本号是11.0.0,于是我卸载了index工程下的css-loader插件,命令是:cnpm uninstall css-loader --save-dev,然后安装指定的版本号:cnpm install [email protected]。vue-loader插进同理。然后我执行:npm run build,问题解决了,看来是插件升级之后不兼容或本身有不过。哈哈哈!很有成就感。

你可能感兴趣的:(javascript)