使用 Docker 构建。这是在 Windows 环境下为银河麒麟(Linux ARM64)生产正确 node_modules 依赖文件夹的最规范、最可靠的方法。
方案核心思想
利用 Docker 的跨平台构建能力,我们在 Windows 主机上启动一个容器,但这个容器内部模拟的是一个 Linux ARM64 的环境。在这个“仿真的”目标环境中执行 npm install,所有下载的依赖包,特别是包含二进制文件的可选依赖(如 @rollup/rollup-linux-arm64-gnu),都会是适用于 Linux ARM64 架构的正确版本。
准备工作
- 安装 Docker Desktop for Windows:
· 前往 Docker 官网 下载并安装。
· 安装完成后,启动 Docker Desktop。确保它在后台运行(系统托盘区有 Docker 鲸鱼图标)。 - 确保项目结构清晰: 你的 Vue 项目目录结构应该大致如下:
my-vue-app/ # 项目根目录 ├── node_modules/ # 【现有错误的,可以忽略或先删除】 ├── src/ # 源码目录 ├── package.json # 项目依赖定义文件 ├── vite.config.ts # Vite 配置文件 └── ... # 其他文件
详细步骤
第 1 步:创建 Dockerfile
在项目根目录下创建一个名为 Dockerfile 的文件(没有后缀)。这个文件是告诉 Docker 如何构建环境的指令集。
# 使用一个官方 Node.js 的 Alpine 版本,并指定目标平台为 linux/arm64。
# Alpine 版本非常小巧,适合作为基础镜像。
# 注意:--platform 标志强制 Docker 为我们模拟 ARM64 环境。
FROM --platform=linux/arm64 node:20-alpine
# 在容器内设置工作目录,所有后续命令都将在此目录下执行
WORKDIR /app
# 首先,只复制 package.json 和 package-lock.json (如果存在)
# 这一步利用 Docker 的缓存机制:只有当 package.json 发生变化时,才会重新执行 npm install,极大加速后续构建。
COPY package*.json ./
# 在容器内运行命令,安装所有依赖(包括 devDependencies)
# 如果内网需要代理,可以在这里添加参数,例如:
# RUN npm install --registry=https://your-internal-registry.npm.com/
RUN npm install
# (可选)将整个项目目录复制到容器的工作目录
# 我们目前只需要 node_modules,所以这一步严格来说不是必须的,但为了方便后续可能的完整镜像构建,这里先写上。
COPY . .
# (可选)设置环境变量,强制 Rollup 使用纯 JS 版本,避免任何潜在的本地绑定问题,作为双重保险。
ENV ROLLUP_DISABLE_NATIVE=true
# 由于我们只是用来提取 node_modules,所以不需要指定默认的启动命令。
# 但如果要测试,可以取消下一行的注释:
# CMD ["npm", "run", "dev"]
第 2 步:构建 Docker 镜像
打开 PowerShell 或 CMD,导航到你的项目根目录(Dockerfile 所在的位置)。
运行以下命令来构建 Docker 镜像。-t 参数给镜像打一个标签名,便于识别。
docker build --platform linux/arm64 -t my-vue-app-arm64 .
· --platform linux/arm64:至关重要。它指示 Docker 为 Linux ARM64 架构构建镜像,并在当前 Windows 系统上通过模拟器实现。
· -t my-vue-app-arm64:将镜像命名为 my-vue-app-arm64。
· .:最后一个点表示构建上下文是当前目录。
Docker 将开始执行 Dockerfile 中的指令。你会看到它拉取 Node.js 的 Alpine 基础镜像,然后执行 npm install。这将花费一些时间。
第 3 步:从镜像中提取 node_modules
镜像构建成功后,我们需要把容器里已经安装好的 node_modules 目录复制到 Windows 主机上。
- 创建一个临时容器并复制文件: 运行以下命令:
现在,你的项目根目录下会出现一个全新的 node_modules_arm64 文件夹。# 1. 基于刚构建的镜像创建一个临时容器,并将其命名为 "temp-container" docker create --platform linux/arm64 --name temp-container my-vue-app-arm64 # 2. 将容器中的 /app/node_modules 目录复制到当前目录下的 ./node_modules_arm64 文件夹 docker cp temp-container:/app/node_modules ./node_modules_arm64 # 3. 清理临时容器 docker rm temp-container
第 4 步:部署到内网银河麒麟系统
- 重命名与打包:
· 将 Windows 上的 node_modules_arm64 文件夹重命名为 node_modules。
· 重要:删除你原来的、有问题的 node_modules 文件夹(如果你还有的话)。
· 将整个项目文件夹(包含新的、正确的 node_modules 以及你的源码)打包成 .tar.gz 或 .zip 文件。# 例如,在 PowerShell 中可以使用 Compress-Archive Compress-Archive -Path .\my-vue-app\* -DestinationPath .\my-vue-app-for-kylin.zip - 传输与解压:
· 将打包好的文件通过U盘、内网传输工具等方式拷贝到银河麒麟系统中。
· 在银河麒麟系统上解压文件。 - 最终权限修复(在银河麒麟上执行): 即使 Docker 中安装的依赖架构正确,文件权限在压缩-传输-解压过程中仍可能发生变化。因此,在银河麒麟系统上,进入项目目录,必须执行以下命令:
# 进入项目目录 cd /path/to/your/my-vue-app # 为所有 CLI 工具(如 vite, rollup 等)添加可执行权限 chmod -R +x node_modules/.bin/ - 运行项目:
现在,项目应该可以正常启动,不会再出现 Permission denied 或找不到 linux-arm64-gnu 模块的错误。npm run dev
优势总结
· 环境一致性:确保了开发、构建和生产环境的高度一致,避免了“在我电脑上是好的”这类问题。
· 依赖正确性:100% 获得适用于目标平台(Linux ARM64)的正确依赖版本。
· 可重复性:Dockerfile 记录了构建环境的精确定义,整个过程可以被任何人、在任何时间重复,结果完全相同。
· 高效利用缓存:Docker 层缓存机制使得在依赖未变更时,后续构建速度极快。
这个方案虽然前期需要学习一些 Docker 的基本概念,但它是一次投入、长期受益的最佳实践,特别适合内网开发和跨平台部署的场景。