webpack

针对webpack代码打包压缩, 实现通过容器镜像仓库在线编译前端代码.

改样例需求

• 前端代码放在html目录下
• 最终编译后的index.html需要改为php的模板文件
  • 删除原先的index.tpl.php

编译思路

• 引用node镜像
  • 安装node依赖
  • 编译前端代码
• 引用php镜像
  • 安装php依赖
• 引用busybox镜像, 最小化
  • 通过php镜像复制php相关代码
  • 通过node镜像复制前端相关代码

样例

Dockerfile

FROM registry.cn-hangzhou.aliyuncs.com/marmot/node-front AS node-builder
COPY ./html/package.json /usr/src/app/
COPY ./html/package-lock.json /usr/src/app/
COPY ./html/yarn.lock /usr/src/app/

RUN cd /usr/src/app/ && npm config set registry=https://registry.npm.taobao.org \
    && npm install \
    && npm cache clean --force \
    && yarn config set registry=https://registry.npm.taobao.org \
    && yarn install \
    && yarn cache clean

COPY ./html /usr/src/app/
RUN cd /usr/src/app && yarn build:prod

FROM registry.cn-hangzhou.aliyuncs.com/phpfpm/phpfpm-front:latest AS php-builder

COPY composer.json /var/www/html/
RUN composer install --no-dev && composer dump-autoload --optimize
COPY . /var/www/html/

FROM registry.cn-hangzhou.aliyuncs.com/marmot/busybox
COPY --from=php-builder /var/www/html /var/www/html
COPY --from=node-builder /usr/src/app/dist /var/www/html/public
RUN mv /var/www/html/public/index.html /var/www/html/View/Smarty/Templates/Home/Index.tpl && chown -R www-data:www-data /var/www/html