如何解决Docker中安装Vue.js时的Node版本不兼容错误？

问题详情 #

尝试在Docker环境下搭建Vue.js项目，执行vue create .时触发版本兼容错误，相关配置与操作如下：

使用的配置文件 #

docker-compose.yml

version: '3.8'
services:
  app:
    build: .
    container_name: vue-curriculum
    ports:
      - '8880:8880'
    volumes:
      - ./app:/app
    tty: true

Dockerfile

FROM node:15.11.0-alpine

WORKDIR /app

RUN yarn global add @vue/cli

操作流程 #

docker-compose up -d # 容器创建成功
docker container exec -it vue-curriculum sh 
vue create .

报错信息 #

Vue CLI v5.0.8
? Generate project in current directory? Yes


Vue CLI v5.0.8
? Please pick a preset: Default ([Vue 2] babel, eslint)
? Pick the package manager to use when installing dependencies: Yarn


Vue CLI v5.0.8
✨  Creating project in /app.
⚙️  Installing CLI plugins. This might take a while...

yarn install v1.22.5
info No lockfile found.
[1/4] Resolving packages...
[2/4] Fetching packages...
error jest-worker@28.1.3: The engine "node" is incompatible with this module. Expected version "^12.13.0 || ^14.15.0 || ^16.10.0 || >=17.0.0". Got "15.11.0"
error Found incompatible module.
info Visit https://yarnpkg.com/en/docs/cli/install for documentation about this command.
 ERROR  Error: command failed: yarn 
Error: command failed: yarn 
    at ChildProcess.<anonymous> (/usr/local/share/.config/yarn/global/node_modules/@vue/cli/lib/util/executeCommand.js:138:16)
    at ChildProcess.emit (node:events:378:20)
    at maybeClose (node:internal/child_process:1067:16)
    at Process.ChildProcess._handle.onexit (node:internal/child_process:301:5)
/app # 

解决方法 #

原因分析 #

错误提示清晰表明：当前使用的Node.js 15.11.0版本不在jest-worker@28.1.3要求的兼容版本列表内，该模块需要Node版本满足^12.13.0 || ^14.15.0 || ^16.10.0 || >=17.0.0。

方案一：更换符合要求的Node版本（推荐） #

修改Dockerfile中的基础镜像，替换为兼容的Node.js版本，比如长期支持的16.x版本：

FROM node:16.20.2-alpine # 也可选择14.21.3、18.17.1等符合要求的版本

WORKDIR /app

RUN yarn global add @vue/cli

修改完成后，重新构建并启动容器：

docker-compose down
docker-compose build --no-cache
docker-compose up -d

之后再次进入容器执行vue create .，即可正常完成依赖安装。

方案二：忽略引擎版本检查（不推荐） #

如果暂时无法更换Node版本，可以通过添加--ignore-engines参数跳过版本检查：

进入容器后，执行vue create .完成项目初始化步骤，当yarn安装失败时，手动执行：

yarn install --ignore-engines

或者在创建项目时直接指定参数：

vue create . --packageManager yarn --ignore-engines

注意：这种方式可能引发潜在的兼容性问题，仅作为临时解决方案。

内容的提问来源于stack exchange，提问作者reiky