这是一个使用CNB自动打包nextjs项目并推送到制品库的demo

本项目使用app路由，请参考nextjs官方的文档：项目结构

• 复制cnb.yml中push阶段的配置到项目的cnb配置下
• 将Dockerfile复制到项目根目录，并修改配置
• 修改项目next.config.ts的output为standalone
• 推送代码到cnb，自动构建

将CNB的镜像pull到本地，需要使用您的访问令牌进行鉴权，登录cnb制品库

docker login -u cnb docker.cnb.cool
# 输入您的访问令牌
docker pull docker.cnb.cool/xxxxx/xxxxxx:latest
# 运行
docker run -p 9000:9000 docker.cnb.cool/xxxxx/xxxxxx:latest

访问http://localhost:9000即可访问

push:
- services:
   - docker
  stages:
     # 同名镜像构建&推送
   - name: docker build
          script: docker build -t ${CNB_DOCKER_REGISTRY}/${CNB_REPO_SLUG_LOWERCASE}:latest .
   - name: docker push
          script: docker push ${CNB_DOCKER_REGISTRY}/${CNB_REPO_SLUG_LOWERCASE}:latest

这段配置表示在使用git push，推送至CNB时，自动构建并推送镜像，其中构建配置在Dockerfile中

自行前往Dockerfile查看

这里使用的是官方的配置分阶段构建，在末尾处可以自定义监听端口

# 监听的端口，需要EXPOSE暴露出来
ENV PORT=9000
EXPOSE 9000

为了减少镜像的体积，需要打包为standalone模式

import type { NextConfig } from "next";
const nextConfig: NextConfig = {
  /* config options here */
  /**⚠️注意：Docker打包的时候为了防止打包后文件过大，这里设置为standalone*/
  output: 'standalone',
};
export default nextConfig;