npm install命令给vue前端项目安装依赖时常见问题以及解决思路

1、常见问题

  1. 没有安装nodeJS的运行环境
  2. 没有安装npm包管理工具
  3. 网络问题,由于国内外环境因素,导致npm包下载不完整或者出错中断
  4. npm chaches

2、解决思路

2.1 情况1解决方法

只需要下载nodeJS的安装包,安装就可以,操作可参考博客:

  1. windows系统安装:https://www.cnblogs.com/zhouyu2017/p/6485265.html
  2. CentOS系统安装: https://www.cnblogs.com/fozero/p/10967154.html
2.2 情况2解决方法

一般正常安装了nodeJS之后,不会出现这种问题,因为nodeJS安装成功了之后会自动帮我们把npm包管理工具安装上,但是也不排除异常的可能性,如果出现了,就彻底卸载nodeJS,重新安装即可。

2.3 情况3解决方法

这种情况一般没辙, 网络不好,时断时连,这个得自己处理网络的问题,在网络良好的情况下,可以通过修改npm包的镜像源的方式,加速依赖包下载的速度,来避免这种问题

2.4 情况4解决方法

错误的报错信息大致如下:
npm install命令给vue前端项目安装依赖时常见问题以及解决思路_第1张图片
这个错误因为报错信息很具有误导性,已开始我一直以为是文件权限的原因,通过管理员权限再次执行还是不行,因为不是文件权限的问题导致的,之后我拷了一个包含所有依赖包的完整项目,比对之后发现我安装的依赖和别人正常的项目中的依赖中文件个数不一致,反复确认,问题应该就是我第一次npm install安装的时候某个依赖包因为网络的原因没有完整的安装,只安装了一部分,再次执行npm install的时候知识删除了项目中的node_modules文件夹, 但是没有清理npm的caches文件

所以,要想解决这个问题,就应该先彻底清除上次安装的包,想要彻底清除则一般需要以下2步:
第一步:删除node modules中的全部文件。
第二步:清除Npm缓存。

2.4.1 删除全部node modules文件的两种方式
2.4.1.1 直接删除项目下的node_modules文件夹

缺点: 当项目依赖包过多时,删除速度非常慢。

2.4.1.2 通过全局安装rimraf包删除【这个工具最好全局安装】。
# 全局安装命令
npm install -g rimraf

安装成功之后,进入到项目的node_modules目录下,打开命令行:
npm install命令给vue前端项目安装依赖时常见问题以及解决思路_第2张图片

# 执行删除依赖包的命令,这个命令超级好用,依赖基本就是秒删
rimraf node_modules
2.4.2 清除npm缓存caches文件的两种方式
2.4.1.1 直接删除缓存文件,删除C:\Users\用户名.npmrc 这个文件。
2.4.1.2 通过命令进行清理
# 清理npm缓存的命令
npm cache clean --force

以上步骤完成之后,再次进入到项目的根目录,打开命令行,执行npm install即可。

3 其他类型报错如何解决

3.1:项目启动失败报错

问题描述:1、版本错误, 我这里系统升级到了win10, 安装了最新nodeJS版本18.13.6, 依赖安装完成之后, npm run dev无法启动项目
npm install命令给vue前端项目安装依赖时常见问题以及解决思路_第3张图片

问题原因:因为 node.js V17版本中最近发布了OpenSSL3.0, 而OpenSSL3.0对允许算法和密钥大小增加了严格的限制,可能会对生态系统造成一些影响,对于低版本的兼容性可能会出现一些问题

解决方式一:设置Node的相关参数, 直接"以管理员方式运行"打开CMD窗口,执行以下命令即可:

set NODE_OPTIONS=--openssl-legacy-provider

这种方式只是临时生效, 电脑重启或CMD命令重启自动就失效了

解决方式二:设置Node的相关参数, 直接"以管理员方式运行"打开CMD窗口,执行以下命令即可:

# 在终端输入一次只能本次生效,如果想永久生效可以在 package.json 文件中修改对应的 scripts 节点的内容如下:
 
"serve": "SET NODE_OPTIONS=--openssl-legacy-provider && vue-cli-service serve",

"build": "SET NODE_OPTIONS=--openssl-legacy-provider && vue-cli-service build",

解决方式三:这个问题的根本原因还是nodeJS的版本问题, 如果觉得以上设置都太麻烦, 就重装nodeJS,将nodeJS版本降低到16及一下即可

解决验证:设置之后,npm run dev重新启动项目成功
npm install命令给vue前端项目安装依赖时常见问题以及解决思路_第4张图片

你可能感兴趣的:(NodeJS,前端,npm,vue.js)