vue项目(pnpm)迁移到无网环境开发

vue项目(pnpm)迁移到无网环境开发(引用链接

由于pnpm项目依赖基于软硬连接实现,无法直接复制node_modules迁移至内网,本文提供两种迁移方案,可根据项目数量、团队协作需求选择。

  • 方式一 :操作简单,适合单个pnpm项目迁移,缺点是不便更新/添加依赖,多人团队需各自重复操作。
  • 方式二 :操作稍复杂,适合多个pnpm项目迁移,支持依赖更新/添加,多人团队仅需一人完成初始配置,其他人直接拉取即可。

方式一:复制外网本地依赖到内网(离线安装)

核心思路:将外网环境的pnpm依赖缓存、硬链接文件及项目代码迁移至内网,通过离线命令安装依赖。

步骤1:外网环境安装项目依赖

在联网的外网电脑上,进入项目根目录执行:

bash 复制代码
pnpm install

可使用官方源registry.npmjs.org、国内源registry.npmmirror.com或本地私库源(如localhost:8081),任意源均可。

步骤2:复制pnpm依赖缓存文件

pnpm默认缓存路径:C:\Users\你的用户名\AppData\Local\pnpm-cache

  • 查看缓存路径命令:npm get cache
  • 将整个pnpm-cache文件夹复制到内网电脑相同路径下;
  • 该文件夹下metadata目录会按源地址分类存放依赖,如localhost+8081registry.npmmirror.com

步骤3:复制pnpm硬链接文件

.pnpm-store为pnpm依赖硬链接文件,隐藏属性 ,存放于项目代码所在磁盘根目录(如D:\.pnpm-store),将其复制到内网电脑相同磁盘根目录

步骤4:迁移项目代码

  1. 删除外网项目根目录下的node_modules文件夹;
  2. 压缩项目代码(必须包含pnpm-lock.yaml文件,用于锁定依赖版本);
  3. 将压缩包复制到内网电脑并解压。

步骤5:配置内网pnpm源地址

进入内网项目根目录,设置pnpm源地址为pnpm-cache/metadata下对应缓存的源地址(与外网安装依赖时的源一致),示例:

bash 复制代码
pnpm set registry http://localhost:8081/repository/npm-hosted/

步骤6:离线安装依赖并运行项目

执行离线安装命令,从本地缓存拉取依赖,无需联网:

bash 复制代码
pnpm install --offline

安装完成后启动项目:

bash 复制代码
pnpm run dev

方式二:连接内网Nexus私库下载依赖(推荐团队/多项目)

核心思路:将外网依赖打包为tgz文件,上传至内网Nexus私库,项目直接从私库拉取依赖,支持后续依赖更新/添加。

前提条件

已搭建内网Nexus私库(若未搭建,需先完成Nexus安装与npm仓库创建,建议先在本地Nexus验证流程,再同步至内网Nexus)。

步骤1:由pnpm-lock.yaml生成package-lock.json

pnpm无原生命令生成npm的lock文件,需借助工具并修改源码实现:

  1. 全局安装转换工具:

    bash 复制代码
    npm i -g pnpm-lock-to-npm-lock
  2. 找到工具安装路径:

    • 用nvm:C:\Users\你的用户名\AppData\Roaming\nvm\对应node版本\node_modules\pnpm-lock-to-npm-lock
    • 不用nvm:C:\Users\你的用户名\AppData\Roaming\npm\node_modules\pnpm-lock-to-npm-lock
  3. 修改源码:打开lib/createLock.js,将原有createLock方法全部替换教程提供的createLock方法代码

  4. 生成package-lock.json:进入项目根目录执行

    bash 复制代码
    pnpm-lock-to-npm-lock pnpm-lock.yaml

注意:若pnpm版本更新导致pnpm-lock.yaml格式变化,需同步修改createLock方法代码逻辑。

步骤2:根据package-lock.json下载依赖tgz包

通过脚本批量遍历package-lock.json,下载所有依赖的tgz压缩包:

  1. 项目根目录新建两个文件夹:nodes(存放已下载依赖,避免重复下载)、tgz(存放待下载tgz包);

  2. 安装脚本依赖:

    bash 复制代码
    pnpm i shelljs --save-dev
  3. 新建npmtgz.js文件,复制教程提供的npmtgz.js脚本代码到文件中;

  4. 执行脚本下载tgz包:

    bash 复制代码
    node npmtgz.js

脚本会自动跳过nodes中已存在的依赖,仅下载未存在的依赖,并输出下载日志。

步骤3:将tgz包上传至内网Nexus私库

先完成Nexus私库登录,再通过脚本批量上传,上传失败的依赖需手动补充上传。

3.1 私库登录(二选一)
  • 命令行登录:npm adduser,按提示输入Nexus账号、密码、邮箱;

  • 配置文件登录:在项目根目录.npmrc中添加(_auth账号:密码window.btoa()加密后的结果):

    复制代码
    registry=http://localhost:8081/repository/npm-hosted2/
    _auth=加密后的字符串
    shamefully-hoist=true
3.2 批量上传tgz包(脚本二选一)
方案A:js脚本(npmupload.js,需安装Node.js)
  1. 新建npmupload.js,复制教程提供的npmupload.js脚本代码
  2. 修改脚本中registry内网Nexus npm仓库地址
  3. 执行上传:node npmupload.js
方案B:shell脚本(push.sh,需安装Git)
  1. 新建push.sh,复制教程提供的push.sh脚本代码
  2. 修改脚本中publishRestful为内网Nexus的REST API地址、admin:123456为Nexus账号密码;
  3. 执行上传:运行shell脚本即可。

步骤4:配置pnpm连接内网Nexus并安装依赖

  1. 项目根目录.npmrc中添加配置:

    复制代码
    auto-install-peers=false
    registry=内网Nexus npm仓库地址
  2. 安装依赖:无需联网,直接从Nexus私库拉取

    bash 复制代码
    pnpm i
  3. 启动项目:

    bash 复制代码
    pnpm run dev

步骤5:后续更新/添加依赖

  1. 外网环境中,在项目根目录执行pnpm add 新依赖/pnpm update 依赖名,更新pnpm-lock.yaml
  2. 重复步骤1 ,由新的pnpm-lock.yaml生成新的package-lock.json
  3. 重复步骤2 ,下载新依赖的tgz包,将原有tgz包移至nodes文件夹避免重复下载;
  4. 重复步骤3,将新tgz包上传至内网Nexus私库;
  5. 内网团队成员直接执行pnpm i,即可拉取更新后的依赖。

注意事项

  1. 迁移过程中必须保留pnpm-lock.yaml,确保内外网依赖版本一致;
  2. 方式二中若tgz包上传失败,需手动在Nexus后台上传对应包;
  3. 多人团队使用方式二时,需将.npmrc、相关脚本纳入项目版本管理,确保配置统一;
  4. Nexus私库需开放对应权限,确保团队成员可拉取依赖。
相关推荐
Han.miracle2 小时前
Spring IoC 与 DI 核心知识点综合测试题
java·前端·数据库
-杨豫2 小时前
JavaScript入门到精通全套资料,以及核心进阶ES6语法,API,js高级等基础知识和实战教程
开发语言·javascript·es6
im_AMBER2 小时前
react-i18next 国际化支持
前端·react.js·前端框架
文心快码BaiduComate2 小时前
Comate 3月全新升级:全新Plan模式、Explore Subagent深度检索能力增强
前端·后端·程序员
Lsx_2 小时前
前端发版后页面白屏?一套解决用户停留旧页面问题的完整方案
前端·javascript·掘金·日新计划
方安乐2 小时前
pnpm与npm混用为什么会报错?
前端·npm·node.js
什么时候星期五2 小时前
node版本升级后,项目跑不起来
前端·node.js
Forever7_2 小时前
扫码枪卡顿有效解决方案
前端
aZhe的全栈知识分享2 小时前
OpenClaw(龙虾)太难装?这份保姆级教程让你 3 分钟搞定
前端·人工智能·后端