HUGO

Best way to import external sass library from GitHub?

Hello everyone,

I’m currently developing a theme, based on Primer CSS by GitHub.

I wonder: When users install my theme, I want to make sure they can make use of the most recent version. What’s the best way to implement that, so that I do not always have to update the Primer CSs manually?

I was thinking modules would be a way (config.yaml):

module:
  imports:
    - disable: false
      path: github.com/primer/css/tree/master/src
      mounts:
          - source: scss
            target: assets/scss/primer

However, this didn’t work.

The most recent Primer CSS version is always at https://github.com/primer/css/tree/master/src, so it would be best if I only would need to update my own custom theme files.

Thanks in advance!

The path should, in general, point to the root, e.g. github.com/primer/css – if the source lives in a subfolder, you need to set that in source – e.g. src/scss.

Okay, thank you! So I changed it:

module:
  imports:
    - disable: false
      path: github.com/primer/css
      mounts:
          - source: src/scss
            target: assets/scss/primer

The code runs, but nothing happens? There are also new files that clone into the directory.

I’m sorry, but I cannot help you further with the information you provides – but note that the modules will not be cloned into your project. They will be downloaded into a temp folder.

Is there another/better automatic way to pull a folder from Github into the Hugo assets directory?

No, that is the best way.