Your submission was sent successfully! Close

Thank you for signing up for our newsletter!
In these regular emails you will find the latest updates from Canonical and upcoming events where you can meet our team.Close

Thank you for contacting our team. We will be in touch shortly.Close

  1. Blog
  2. Article

Anthony Dillon
on 19 November 2015


We’re using NPM as Vanilla’s package manager. Which gives us a number of advantages such as, an easy way to install and update the CSS framework. This all worked fine until we hit an issue with Github Pages. They do not supporting install scripts therefore it is not possible in npm install. Highlighted in this issue #4 on the Jekyll Vanilla theme project.

There are a number of ways to use Vanilla with Jekyll. Here are the number of methods we discussed with their pros and cons.

Commit node_modules

This is not recommended as it duplicates a lot of code. The repo will grow in size as it will include all the framework code also.

Clone and commit Vanilla without NPM

Again this will include the entire framework in the repos code base. Another downfall would be the loss of the NPM update process.

Use Git submodules

This is the method we went with in the end. Creating a submodule in the git repo does not add all the code to the project but includes a reference and path to include the framework.

By running the following command it will pull down the framework into the correct location.

We lose NPM’s functionality but submodules are understood and run when a Github Pages are built.

Conclusion

These methods were derived from a short exploration, but solved our issue. Any better methods would be very much welcomed in the comments. You can see a demo of the Vanilla theme running on the projects Github Page below:

Related posts


Bartek Szopka
18 July 2023

Vanilla 4.0 release

Design Article

Last week we released a new major version of the Vanilla framework. Vanilla 4.0 introduces the elements of the new style used for a current rebranding of Canonical’s brochure websites, including typography changes of headings utilising new variable Ubuntu font, wider grid width, removed rounded corners, some updated colours, and updates t ...


bethcollins
17 March 2022

How we implemented an interactive Live Demo Box

Design Article

The Vanilla squad recently spent a two week sprint prototyping an interactive live demo box. We were tasked with coming up with a proof of concept, to enable demoing of each variant of our examples dynamically. A few guest developers were able to joined us, which meant four of us were able to dedicate a ...


Bartek Szopka
10 January 2022

Release of Vanilla framework v3.0

Ubuntu Article

We’ve just released Vanilla v3.0 – a new major update to our CSS framework. It includes a few significant updates and improvements around spacing variables, responsive breakpoints, a new expanding search box and various updates to existing components. Important aspects of the release include dropping a noticeable chunk of deprecated style ...