nextjs的standalone模式
由于node_modules日益增大的体积,电脑磁盘的压力与来越大,未来节约空间,在日常开发中慢慢切换为使用pnpm;
pnpm有一个全局的store,项目中的node_modules/.pnpm使用硬连接的方式指向全局store。这篇新一代包管理工具 pnpm 使用心得可以了解pnpm。
本文主要介绍在nextjs在docker中使用pnpm,官网的Dockerfile文件
FROM node:18-alpine AS base # Install dependencies only when needed FROM base AS deps # Check https://github.com/nodejs/docker-node/tree/b4117f9333da4138b03a546ec926ef50a31506c3#nodealpine to understand why libc6-compat might be needed. RUN apk add --no-cache libc6-compat WORKDIR /app # Install dependencies based on the preferred package manager COPY package.json yarn.lock* package-lock.json* pnpm-lock.yaml* ./ RUN \ if [ -f yarn.lock ]; then yarn --frozen-lockfile; \ elif [ -f package-lock.json ]; then npm ci; \ elif [ -f pnpm-lock.yaml ]; then corepack enable pnpm && pnpm i --frozen-lockfile; \ else echo "Lockfile not found." && exit 1; \ fi # Rebuild the source code only when needed FROM base AS builder WORKDIR /app COPY /app/node_modules ./node_modules COPY . . # Next.js collects completely anonymous telemetry data about general usage. # Learn more here: https://nextjs.org/telemetry # Uncomment the following line in case you want to disable telemetry during the build. # ENV NEXT_TELEMETRY_DISABLED 1 RUN \ if [ -f yarn.lock ]; then yarn run build; \ elif [ -f package-lock.json ]; then npm run build; \ elif [ -f pnpm-lock.yaml ]; then corepack enable pnpm && pnpm run build; \ else echo "Lockfile not found." && exit 1; \ fi # Production image, copy all the files and run next FROM base AS runner WORKDIR /app ENV NODE_ENV production # Uncomment the following line in case you want to disable telemetry during runtime. # ENV NEXT_TELEMETRY_DISABLED 1 RUN addgroup --system --gid 1001 nodejs RUN adduser --system --uid 1001 nextjs COPY /app/public ./public # Set the correct permission for prerender cache RUN mkdir .next RUN chown nextjs:nodejs .next # Automatically leverage output traces to reduce image size # https://nextjs.org/docs/advanced-features/output-file-tracing COPY /app/.next/standalone ./ COPY /app/.next/static ./.next/static USER nextjs EXPOSE 3000 ENV PORT 3000 # set hostname to localhost ENV HOSTNAME "0.0.0.0" # server.js is created by next build from the standalone output # https://nextjs.org/docs/pages/api-reference/next-config-js/output CMD ["node", "server.js"]
依赖安装
使用pnpm时,通过判断pnpm-lock.yaml
是否存在来执行corepack enable pnpm && pnpm i --frozen-lockfile
。
COPY package.json yarn.lock* package-lock.json* pnpm-lock.yaml* ./ RUN \ if [ -f yarn.lock ]; then yarn --frozen-lockfile; \ elif [ -f package-lock.json ]; then npm ci; \ elif [ -f pnpm-lock.yaml ]; then corepack enable pnpm && pnpm i --frozen-lockfile; \ else echo "Lockfile not found." && exit 1; \ fi
打包
打包是将上一阶段安装的依赖复制过来
FROM base AS builder WORKDIR /app COPY /app/node_modules ./node_modules COPY . . RUN \ if [ -f yarn.lock ]; then yarn run build; \ elif [ -f package-lock.json ]; then npm run build; \ elif [ -f pnpm-lock.yaml ]; then corepack enable pnpm && pnpm run build; \ else echo "Lockfile not found." && exit 1; \ fi
上面复制node_modules
时,由于pnpm使用符号连接,Dockerfile中的COPY
命令会复制软连接指向的文件,而不是保留软连接,这样最后得到的就是实际文件。如果软连接指向的文件在当前构建上下文之外时,COPY
就不能如期复制需要的文件。
由于nextjs运行时只需要运行时的依赖就行,但是直接复制node_modules
会携带构建时的依赖,无疑增大了镜像的体积。
所以nextjs提供了standalone
模式来更好的解决这个问题。
standalone模式介绍
开启standalone模式,next.config.js:
/** @type {import('next').NextConfig} */ module.exports = { output: "standalone", };
构建后.next
结构如下,其中standalone
目录中包含运行时需要的node_modules
,同时还包含一个.next
目录。
其中node_modules
中包含运行时需要的所有的依赖包,并且是文件的形式,不是链接。
最后镜像真正需要的复制的的文件如下:
COPY /app/public ./public COPY /app/.next/standalone ./ COPY /app/.next/static ./.next/static
注意:运行时通过node server.js
命令,因为生成的node_modules
中不包含.bin
目录,所以没法通过pnpm run start
启动(可以通过node_modules/.bin和依赖命令原理了解.bin
的作用)。
最后
以上就是本次通过docker中使用pnpm安装nextjs依赖的过程。