首页 前端知识 npm下载及离线安装

npm下载及离线安装

2024-09-08 02:09:25 前端知识 前端哥 665 606 我要收藏

文章目录

  • 一、npm联网下载
  • 二、npm离线测试安装
  • 三、npm实际离线安装问题
  • 四、成功

一、npm联网下载

  1. 确认联网机和离线机的node和npm版本是否一致。
  • win+R,cmd,运行命令提示符:
// 查看node版本
node -v
// 查看npm版本
npm -v
复制

在这里插入图片描述

  1. 下载
  • 新建一个文件夹(NpmPack),用于存放下载的包。
// 通过命令提示符(手动新建也一样)
mkdir NpmPack
复制

在这里插入图片描述

  • 根据需要,下载需要的包。
npm install <pack_name>
// 例:
npm install vue-qr
// 因为需要下载好几个包,我又新建了一个vue-qr文件夹,用于存放下载的vue-qr包
复制

下载成功如下图:在这里插入图片描述

此时,文件夹内多了一下文件夹和文件在这里插入图片描述

  • 生成.tgz文件,离线安装时,需要用它安装
npm pack <pack_name>
// 例:
npm pack vue-qr
复制

在这里插入图片描述
在这里插入图片描述
vue-qr-4.0.9.tgz文件同样存放于vue-qr文件夹内。
在这里插入图片描述

二、npm离线测试安装

  1. 离线安装
    断网测试(还没有在另一台离线机子上测试)。
// npm install path\pack_name-version.tgz
// 如下:
npm install E:\Code\Java\Environment\NpmPack\vue-qr\vue-qr-4.0.9.tgz
复制

在这里插入图片描述
本机(联网机)离线安装测试成功。

三、npm实际离线安装问题

联网机离线测试安装后,尝试在无网络的机子上进行安装,遇到了一下问题:

  1. 第一次尝试安装-失败
This version of npm is compatible with lockfileVersion@1,
but package-lock.json was generated for lockfileVersion@2.
I’ll try to do my best with it!
复制

即:
npm WARN read-shrinkwrap 这个版本的 npm 兼容 lockfileVersion@1,
但是 package-lock.json 是为 lockfileVersion@2 生成的。
我会尽力做到最好的!
于是去看了一下2台机子的package-lock.json文件,发现:

联网机 package-lock.json

{
"name": "ruoyi",
"version": "3.8.7",
"lockfileVersion": 1,
"requires": true,
}
复制

离线机 package-lock.json

{
"name": "ruoyi",
"version": "3.8.7",
"lockfileVersion": 2,
"requires": true,
}
复制

当尝试直接修改离线机package-lock.json 的 lockfileVersion值,将其由2修改为1后,再次安装,仍然npm包仍然安装失败。提示信息未变。

问题1:

那有没有办法通过修改离线机的 lockfileVersion 值,使npm包顺利安装?

问题2:

同样的若依框架源代码,同样的node、npm版本,为什么在2台机子上,package-lock.json文件中>lockfileVersion会不一样?

四、成功

经历n次查找和尝试之后,终于找到了正确的方法。

从开始到这次成功,整个过程挺蛋疼的,原来只需要如下就行......

例如:vue-qr插件

  1. 下载vue-qr插件
- // vue-qr插件下载位置位于:
..\NpmPack\vue-qr
// 需要的可能就是这个:..\NpmPack\vue-qr\node_modules\vue-qr\src\packages\vue-qr.vue
复制
  1. 复制粘贴
- // 若依项目文件的node_modules文件夹位置如下:
...\RuoYi-Vue-master\RuoYi-Vue-master\ruoyi-ui\node_modules
复制

将…\NpmPack\vue-qr\node_modules文件夹下vue-qr文件夹赋值粘贴到项目文件node_modules文件夹下,完事。

  1. 引用
import VueQr from 'vue-qr/src/packages/vue-qr.vue';
复制
转载请注明出处或者链接地址:https://www.qianduange.cn//article/17884.html
评论
还可以输入200
共0条数据,当前/页
发布的文章

安装Nodejs后,npm无法使用

2024-11-30 11:11:38

大家推荐的文章
会员中心 联系我 留言建议 回顶部
复制成功!