Podman容器中Next.js应用引入js-cookie模块后构建报错求助

1. 确认package.json依赖配置 #

检查项目根目录的package.json，确保js-cookie已被添加到dependencies字段（而非devDependencies，Next.js生产构建需要依赖在dependencies中）。如果缺失，执行以下命令：

npm install js-cookie --save

执行后重新提交package.json和package-lock.json，再重新构建容器。

2. 验证Dockerfile构建逻辑 #

容器构建是独立于本地环境的，必须确保Dockerfile包含完整的依赖安装流程：

• 先复制package.json和package-lock.json到容器工作目录
• 执行依赖安装命令（推荐用npm ci而非npm install，确保依赖版本与lock文件完全一致）
• 再复制项目源码进行构建

示例正确的Dockerfile片段：

FROM node:18-alpine AS builder
WORKDIR /app
# 先复制依赖配置文件，利用构建缓存
COPY package*.json ./
RUN npm ci
# 再复制全部源码
COPY . .
RUN npm run build

# 生产运行阶段
FROM node:18-alpine AS runner
WORKDIR /app
COPY --from=builder /app/.next ./.next
COPY --from=builder /app/node_modules ./node_modules
COPY --from=builder /app/package*.json ./
CMD ["npm", "start"]

如果你的Dockerfile跳过了上述步骤（比如直接复制本地node_modules或省略npm install），会导致容器内缺失依赖。

3. 清理Podman构建缓存 #

Podman-compose会缓存构建层，可能导致旧的依赖状态被复用。强制重新构建：

podman-compose build --no-cache app

如果问题仍存在，可清理Podman所有未使用的缓存资源（谨慎操作，会删除未使用的镜像、容器等）：

podman system prune -a

4. 检查page.js导入语句 #

确认./src/app/crea-personaggio/page.js第7行的导入没有拼写错误，正确写法应为：

import Cookies from 'js-cookie';

避免拼写错误（比如写成js-cookies）或错误的路径引用。

5. 统一包管理器环境 #

确保本地和容器内使用相同的包管理器（npm/yarn/pnpm），不要混用。例如本地用npm安装依赖，Dockerfile中也要用npm执行安装命令，避免依赖版本不一致。

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