docker部署项目

1、根目录新建 Dockerfile

# 使用官方 Node.js 镜像作为基础镜像
FROM node:18-slim

# 设置工作目录
WORKDIR /app

# 将 package.json 和 package-lock.json 拷贝到容器中
COPY package*.json ./

# 安装依赖
RUN npm install --frozen-lockfile

# 将项目文件拷贝到容器中
COPY . .

# 构建 Next.js 项目
RUN npm run build

# 设置环境变量
ENV NODE_ENV production

# 启动 Next.js 服务
EXPOSE 3000
CMD ["npm", "start"]

2、根目录新建 .dockerignore

node_modules
.next
Dockerfile
.dockerignore
README.md
node_modules
.DS_Store
dist
dist-ssr
*.local
.eslintcache
report.html

yarn.lock
npm-debug.log*
.pnpm-error.log*
.pnpm-debug.log
tests/**/coverage/

# Editor directories and files
.idea
*.suo
*.ntvs*
*.njsproj
*.sln
tsconfig.tsbuildinfo

3. 在宝塔面板中上传项目

1. 上传项目文件
   使用宝塔面板的「文件管理」功能，将本地的 Next.js 项目文件上传到服务器上。建议将项目放在 /www/wwwroot/your-nextjs-app/ 目录下。

2. 设置文件权限
   确保项目文件夹及其中的文件具有正确的权限。你可以在「文件管理」中右键点击文件夹，然后设置文件权限。

4. 构建 Docker 镜像

1. 进入 SSH 终端
   在宝塔面板的左侧菜单中，点击「SSH」终端，进入服务器的命令行界面。

2. 构建 Docker 镜像
   在项目文件夹内执行以下命令来构建 Docker 镜像：

   bash

   复制编辑

   cd /www/wwwroot/your-nextjs-app/
docker build -t nextjs-app .


   这会使用 Dockerfile 构建一个名为 nextjs-app 的镜像。

5. 运行 Docker 容器

1. 启动容器
   使用以下命令启动容器并将容器的 3000 端口映射到服务器的 3000 端口：

   bash

   复制编辑

   docker run -d -p 3000:3000 nextjs-app


   该命令会在后台运行容器，并且映射容器内的 3000 端口到服务器的 3000 端口。

2. 查看容器状态
   使用以下命令查看容器是否启动成功：

   bash

   复制编辑

   docker ps


   如果一切正常，你应该能看到 nextjs-app 容器正在运行。

6. 配置反向代理（Nginx）

如果你希望通过域名访问你的 Next.js 应用（例如 http://your-domain.com），你需要配置 Nginx 作为反向代理。

1. 进入宝塔面板的 Nginx 管理页面
   在宝塔面板的左侧菜单中，点击「Nginx」进行配置。

2. 添加反向代理配置
   在 Nginx 配置页面，点击「添加站点」，然后配置如下：

   • 域名：填入你的域名（例如 your-domain.com）。

   • 根目录：可以设置为 /www/wwwroot/your-nextjs-app/，但更重要的是配置反向代理部分。

   • 反向代理：在「反向代理设置」中，填写如下内容：

     nginx

     复制编辑

     location / {
proxy_pass http://127.0.0.1:3000;
proxy_set_header Host $host;
proxy_set_header X-Real-IP $remote_addr;
proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
proxy_set_header X-Forwarded-Proto $scheme;
}


   这样，Nginx 会将对 your-domain.com 的请求代理到 http://127.0.0.1:3000 上，即 Docker 容器中的 Next.js 应用。

3. 重启 Nginx
   配置完成后，点击「重载配置」来重启 Nginx 服务。

7. 完成部署

现在，你应该能够通过访问 http://your-domain.com 来访问你部署在 Docker 容器中的 Next.js 应用。

8.常用命令

# 列出所有容器，包括已经停止的容器。
docker ps -a

# 查看容器的日志
docker logs <container-id>

# 查看 Docker 启动命令或 Docker Compose 配置
docker run -d -p 3000:3000 nextjs-app

# 检查 Docker 服务的状态：
sudo systemctl status docker

# 重新启动 Docker
sudo systemctl restart docker

# 停止并删除容器
docker stop container_id
docker rm container_id

# 删除镜像
docker rmi image_name_or_id

# 查看镜像和容器的关系
docker ps -a --filter ancestor=image_name_or_id