镜像概述

本镜像基于 plone/frontend-builder 构建，继承其前端开发与构建能力，主要用于 Plone CMS（内容管理系统）的前端资源开发、编译与打包。通过提供标准化的构建环境，确保 Plone 前端开发流程一致性，简化前端资源（如JavaScript、CSS、静态文件等）的构建与优化过程。

核心功能与特性

核心功能

• 继承 plone/frontend-builder 的完整前端构建工具链，支持 Plone 前端资源的开发与生产构建
• 集成 Node.js、npm/yarn 等包管理工具，满足前端依赖管理需求
• 内置前端构建工具（如 Webpack、Babel、Sass 等），支持代码转译、打包、压缩等流程
• 提供开发模式（热重载）与生产模式（资源优化）双场景支持

特性

• 环境隔离：避免本地开发环境差异导致的构建问题
• 标准化流程：统一 Plone 前端构建步骤，降低团队协作成本
• 轻量高效：基于***基础镜像优化，减少冗余依赖
• 兼容性：适配 Plone 6+ 前端架构，支持现代前端技术栈

使用场景与适用范围

适用场景

• Plone CMS 项目的前端开发与调试
• Plone 自定义主题或前端扩展的构建
• CI/CD 流程中集成前端资源自动化构建步骤
• 跨平台前端构建（Windows/macOS/Linux 环境一致性保障）

适用人群/团队

• Plone 开发团队（前端/全栈开发者）
• 需要定制 Plone 前端界面的用户
• 自动化构建流程维护人员

使用方法与配置说明

基础使用流程

1. 拉取镜像（假设镜像标签为 plone/frontend-builder-based:latest）：

   bash
   docker pull plone/frontend-builder-based:latest
   

2. 挂载项目目录并运行容器（根据实际场景选择开发或生产模式）。

开发模式（热重载）

用于实时开发调试，修改代码后自动刷新页面：

bash
docker run -it \
  -v $(pwd):/app  # 挂载本地项目目录到容器内/app
  -p 3000:3000    # 暴露开发服务器端口（默认3000，可通过PORT环境变量修改）
  -e NODE_ENV=development  # 指定开发环境
  plone/frontend-builder-based \
  npm run dev  # 启动开发服务器（具体命令需根据项目package.json调整）

生产模式（资源构建）

用于生成优化后的生产环境资源（如压缩JS/CSS、静态文件哈希等）：

bash
docker run -it \
  -v $(pwd):/app  # 挂载本地项目目录，构建产物输出到本地
  -e NODE_ENV=production  # 指定生产环境
  plone/frontend-builder-based \
  npm run build  # 执行生产构建命令（具体命令需根据项目package.json调整）

环境变量配置

注意事项

• 项目目录需包含 package.json 及前端构建配置文件（如 webpack.config.js），以确保构建命令可执行
• 生产构建产物默认输出至项目内 dist 目录（具体路径取决于项目配置）
• 首次运行时需等待依赖安装（node_modules），建议通过挂载本地 node_modules 目录加速重复构建（如 -v $(pwd)/node_modules:/app/node_modules）