Objavljeno

Potpuni vodič za korištenje Bau i Dockera za postavljanje neovisne Next.js aplikacije

Autori

Zašto rasporediti Next.js s Bunom i Dockerom?

Kada je Bun dostigao stabilnu verziju 1, a Vercel ga počeo podržavati kao upravljač paketima (iako se i dalje oslanja na Node za vrijeme izvođenja), bio sam zaintrigiran. Kako možete simulirati proces raspoređivanja Vercela lokalno? Konkretno, kako možete rasporediti samostalnu Next.js aplikaciju s Bunom i Dockerom? Ovaj vodič ima za cilj odgovoriti na ova pitanja.

Preduvjeti

  • Osnovno razumijevanje Dockera, Next.js-a i Buna

  • Instaliran Node.js

  • Instaliran Bun upravljač paketima

Korak-po-korak vodič

Korak 1: Postavljanje Dockerfile-a

Evo kompletnog dockerfile-a koji će vam trebati.

FROM imbios/bun-node:18-slim AS deps
ARG DEBIAN_FRONTEND=noninteractive

# Koristim Asia/Jakarta kao svoju vremensku zonu, možete je promijeniti u svoju vremensku zonu
RUN apt-get -y update && \
  apt-get install -yq openssl git ca-certificates tzdata && \
  ln -fs /usr/share/zoneinfo/Asia/Jakarta /etc/localtime && \
  dpkg-reconfigure -f noninteractive tzdata
WORKDIR /app

# Instalirajte zavisnosti na osnovu preferiranog upravljača paketima
COPY package.json bun.lockb ./
RUN bun install --frozen-lockfile

# Izgradite aplikaciju
FROM deps AS builder
WORKDIR /app
COPY . .

RUN bun run build


# Slika za produkciju, kopirajte sve datoteke i pokrenite next
FROM node:18-slim AS runner
WORKDIR /app

ARG CONFIG_FILE
COPY $CONFIG_FILE /app/.env
ENV NODE_ENV production
# Otkomenitirajte sljedeći redak u slučaju da želite onemogućiti telemetriju za vrijeme izvođenja.
# ENV NEXT_TELEMETRY_DISABLED 1

COPY --from=builder  /app/.next/standalone ./

EXPOSE 3001

ENV PORT 3001

CMD ["node", "server.js"]

Korak 2: Prilagođena skripta u ljusci

Kreirajte prilagođenu skriptu u ljusci ./build.sh.

#!/bin/bash
set -e

# Pokrenite izgradnju Next.js-a s proslijeđenim argumentima
next build "$@"

# Kopirajte datoteke samo ako niste u okruženju CI
if [ -z "$CI" ]; then
  cp -r ./public ./.next/standalone/public
  cp -r ./.next/static ./.next/standalone/.next/static
fi

Uobičajene greške i rješavanje problema

Susreo sam se s nekim problemima tijekom svog prvog pokušaja, posebno greškama s prefiksom node:. Popravio sam ih koristeći imbios/bun-node umjesto oven/bun kao osnovnu sliku. Zato što nam je potreban Node.js kao zamjena za značajke koje Bun još uvijek nije implementirao.

Zaključak

Slijedeći ovaj vodič, trebali biste imati raspoređenu Next.js aplikaciju koja oponaša proces raspoređivanja Vercela, s Bunom i Dockerom. Slobodno prilagodite i optimizirajte postavku u skladu s potrebama vašeg projekta.

Što je sljedeće?

Podijelite ovaj vodič ako vam je bio koristan i ostavite komentar ako imate bilo kakvih pitanja ili poboljšanja. Ostanite u toku za više!