HUGO

How to generate SASS/SCSS trough Asset Pipline (v0.43+) for themes?

Hey!

Ok, it is really simple to generate SASS/SCSS with a working site, but how do you guys are generating these files for a theme?

The only way I can imagine to do that is:

  1. Build the exampleSite with my theme
  2. Copy the generated files to theme folder
  3. Commit & Profit

There is another option? Can I build these files without building a full site?

I have certainly thought about this.

What I would do, and note that this is not something I have any first-hand experience with, but it should work:

As themes now can (and should) provide default configuration via config.toml I would treat the theme as a project. For this use case you probably do not need /content – generate a home page only would probably be Ok. So:

  • Add config.toml with params, menus, media types etc. that are needed.
  • Run hugo from the theme folder (not the exampleSite) and commit the /resources folder.
1 Like

i’m also using the -b and -d flags to build my assets.
in the root of myTheme i can do these:

to build my main scss assets, i run

hugo -b build

to build my docs scss assets, i run

hugo -b build-docs

the -d flags useful, if you want to output the files to specific folder like static.

hugo -b build -d static

you can see the basic concept of it on my repo here

2 Likes

The problem with this approach is that most themes have a exampleSite/ with a config.toml. So you have to run hugo in exampleSite/ and commit exampleSite/resources/. This is a lot of manual work to do for theme maintainer.

Do hugo look for resources in the theme resources directory?

I’ve noticed (and documented in another recent post) that you don’t need to run and commit the resources in the theme if you don’t want to, just instruct theme users to do this themselves. assets from the theme “compile” nicely into the resources folder for the site.

But this requires all users to install the extended version and every additional dependency like post-css and autoprefixer

Yes it does. I didn’t say that would work for everyone. But it may work for some. It works for me since I’m the only person using my theme!