Gulp Build-Prozess in einem Docker-Container

Markus Meier Gulp, Docker

Wie kann man den Gulp-Build-Prozess so vereinheitlichen, dass er auf jedem Computer läuft

Wir hatten/haben das Problem, dass in unserer Firma die unterschiedlichsten Systeme und Setups laufen. Somit war eine Vereinheitlichung der lokalen Umgebungen fast nicht machbar.
Dank Docker kann man aber ein Umgebung schaffen, die für alle gleich ist, egal, welches System man hat.

So haben wir einen minimalen Docker-Container gebaut, um Gulp-Build-Prozesse laufen zu lassen.

Dockerfile
FROM alpine:latest

MAINTAINER Markus Meier

WORKDIR /opt

RUN apk add --no-cache make
RUN apk add --no-cache gcc
RUN apk add --no-cache g++
RUN apk add --no-cache git
RUN apk add --no-cache python2
RUN apk add --no-cache yarn
RUN /usr/bin/yarn global add gulp

VOLUME ["/opt"]
CMD ["gulp", "build"]
Der Container basiert auf Alpine Linux, mit einem minimalen Setup der nötigsten Libs



Als Unterstützung hier das package.json für die gängigsten gulp-plugins, die wir regelmässig benutzen.

package.json
{
    "name": "demotemplate",
    "version": "0.0.1",
    "description": "Demo Template",
    "repository": {
        "type": "git",
        "url": "..............git"
    },
    "author": "Markus Meier",
    "devDependencies": {
        "browser-sync": "^2.8.2",
        "del": "^1.1.1",
        "gulp": "^3.9.0",
        "gulp-autoprefixer": "^2.2.0",
        "gulp-clean-css": "^3.0.3",
        "gulp-concat": "^2.2.0",
        "gulp-file-include": "^0.9.0",
        "gulp-html-replace": "^1.4.5",
        "gulp-htmlmin": "^2.0.0",
        "gulp-if": "^1.2.5",
        "gulp-imagemin": "^3.0.1",
        "gulp-load-plugins": "0.10.0",
        "gulp-plumber": "^1.1.0",
        "gulp-rename": "^1.2.2",
        "gulp-sass": "^2.1.0",
        "gulp-sourcemaps": "^1.6.0",
        "gulp-task-listing": "^1.0.0",
        "gulp-uglify": "^1.5.3",
        "gulp-util": "^2.2.14",
        "panini": "^1.3.0",
        "run-sequence": "^1.2.1",
        "yargs": "^3.8.0"
    }
}


Um die Befehle zu vereinheitlichen, benutzen wir ein Makefile.

Makefile
MAKEFLAGS += --silent

ls:
    sh -c "echo; $(MAKE) -p no_targets__ | awk -F':' '/^[a-zA-Z0-9][^\$$#\/\\t=]*:([^=]|$$)/ {split(\$$1,A,/ /);for(i in A)print A[i]}' | grep -v '__\$$' | grep -v 'Makefile'| sort"

#############################
# Docker machine states
#############################

up:
    docker build -t gulp-builder .

install:
    docker run --rm -v `pwd`:/opt gulp-builder yarn install

#############################
# Gulp
#############################

gulp: gulp-build

gulp-build:
    docker run --rm -v `pwd`:/opt gulp-builder gulp build

gulp-watch:
    docker run -i -t --rm -p 3000:3000 -v `pwd`:/opt gulp-builder gulp watch

gulp-clean:
    docker run --rm -v `pwd`:/opt gulp-builder gulp clean

#############################
# Argument fix workaround
#############################
%:
    @:


  • make ls: Liste alle make Befehle (nach bedarf)
  • make up: Erstellen des Docker-Containers (einmalig)
  • make install: yarn install um alle nötigen libraries zu holen (einmalig)
  • make gulp ...: Diverse build Befehle starten (nach bedarf)


Den effektiven Gulp-Build habe ich hier nicht abgebildet, da sich dieser je nach Projekt sehr unterscheidet.