最近有一个vue项目做完了,需要打包上测试环境进行测试,本来开开心心的,md,结果代码放到线上之后怎么编译都不过,各种报错,简直五花八门,解决一个问题就出现另一个不同的问题,搞得我头都大了。
在这里把解决问题过程的思路记录一下:
1、本地开发环境node的版本与线上环境node的版本要一致。
查看node版本:node -v
2、node_modules目录不可被重用。
项目的打包管理使用的Jenkins,然后从Git上拉代码,Jenkins是什么?
Jenkins是一个开源的、提供友好操作界面的持续集成(CI)工具,起源于Hudson(Hudson是商用的),主要用于持续、自动的构建/测试软件项目、监控外部任务的运行。通常与版本管理工具(SCM)、构建工具结合使用。常用的版本控制工具有SVN、GIT,构建工具有Maven、Ant、Gradle。
在线上环境,我们项目的测试大大对node_modules目录做了一个软连接,其他项目所使用的node_modules也都指向了同一个node_modules目录,也就是所有的vue项目使用同一个node_modules目录。
3、cnpm和npm尽量不要混合使用。
如果使用的npm安装的包,尽量不要再使用cnpm安装,保证依赖包的源一致。
查看当前的包管理是npm还是cnpm使用指令:npm config list
。
找到metrics-registry属性:
npm:"https://registry.npmjs.org/"
cnpm:"https://registry.npm.taobao.org/"
如图,我使用的是npm:
4、问题无法解决,那便删掉node_modules目录,重新npm install
。
重点:本地项目中的package-lock.json文件一定要与线上环境的package-lock.json内容一致。
package-lock.json是在install的时候自动生成的文件。
package-lock.json就是锁定安装时的包版本号,这样就能保证其他人在安装项目依赖的时候,大家使用的包的版本号相同,不会出现纰漏。
package.json文件只能锁定大版本,即版本号的第一位,不能锁定后面的小版本,你每次npm install时候拉取的该大版本下面最新的版本。
一般为了稳定性考虑我们不能随意升级依赖包,因为如果换包导致兼容性bug出现很难排查,所以package-lock.json就是来解决包锁定不升级问题的。
如果要升级package-lock.json里面的库包,需要使用指令:npm install XXX@x.x.x
。