In this article, we'll develop a container for Inkscape, allowing us to incorporate it into a CI/CD pipeline. With that, you'll be able to start automating vector image processing tasks right now and at no extra cost.
You've probably encountered situations where you need a vector graphics program. This might be to resize a logo, draw your own logo, or generate app icons for multiple platforms.
Inkscape is an excellent tool for this job for a number of reasons:
It does a great job at rendering vector images, since that's what it's supposed to do.
It's free and open-source, so you don't have to deal with setting up a license server or getting keys or providing networking connectivity to use it.
It's cross-platform, so it runs on Windows, Mac, Linux, and wherever else it can be built.
Another nice feature of Inkscape is that it has a command line interface. 🤯 This means that you can use it to script vector image processing tasks, all from the command line, which is what we'll be doing below to automate image exports in CI.
Each new build container needs its own project!
This allows the container to be built and released independently of other development activities that are going on. This also makes it easier for new projects to use the new container as well.
Create a new project in GitLab. Then clone it and change into its directory:
git clone [email protected]:your-group/inkscape-container.git cd inkscape-container/
Create a new Dockerfile in the root of your project:
Then edit the Dockerfile as the following.
Let's use an Ubuntu base. Normally, I'd try to find a smaller and lighter base, but because this is a build container, and Inkscape is a complex piece of software with many dependencies, we're better off sticking with simple:
Ubuntu has a very recent version of Inkscape in the
manager, so it's not
required to build or manually download Inkscape. Instead, we just install:
# hadolint ignore=DL3008 RUN apt-get update -y \ && apt-get install -y --no-install-recommends \ inkscape \ && rm -rf /var/lib/apt/lists/*
I call this an
apt sandwich, as
inside a Dockerfile are almost always structured like this.
Here is what the completed Dockerfile should look like:
FROM ubuntu:22.04 # hadolint ignore=DL3008 RUN apt-get update -y \ && apt-get install -y --no-install-recommends \ inkscape \ && rm -rf /var/lib/apt/lists/* CMD ["/bin/bash"]
To save yourself some CI iteration time, it's a good idea to test your container build locally before pushing to GitLab:
docker build -t inkscape-container .
$ docker build -t inkscape-container . Sending build context to Docker daemon 40.45kB Step 1/3 : FROM ubuntu:22.04 ---> 2dc39ba059dc ... ...
You can verify that Inkscape is available by running
inkscape --version inside
docker run --rm -it inkscape-container inkscape --version
.gitlab-ci.yml file and add this snippet:
include: - project: brettops/pipelines/container file: kaniko.yml
By default, this will look for a Dockerfile in the root directory of your project, which is where yours already is at this point, so no configuration is needed.
You'll need an SVG image to convert to PNG. This will be used to add a self-test job to your build container CI. I'm using a drawing of a bearded reedling, because these birds are awesome. You can go ahead and use it, too:
Add the SVG file directly to your repo. It allows the image to be versioned along with your build container, and defends against network issues in your CI environment. Also, it's an SVG, which is just markup, so it can be versioned nicely in Git.
Add a CI job to the deploy stage, which comes after the container build, to test the image that was just built:
test-inkscape: stage: deploy image: registry.gitlab.com/your-group/inkscape-container script: - inkscape --version - inkscape logo.svg -o logo.png -w 144 -h 144 artifacts: paths: - "*.png"
This is all you need for your container to be built and published to GitLab. Commit your changes:
git commit -m "Initial commit" git push --set-upstream origin main
Now you can sit back and wait. You can check on your CI pipeline in GitLab in the meantime.
Once the container is built, you can start using Inkscape in CI pipelines as an easy way to render all the icons you might need. Yay! 🎉