Hugo is not recognising CSS files in the assets directory

support
,
1

A website built with Hugo is using a theme (gokarna) which was defined as a git submodule. I recently decided to start using Hugo modules. I have followed various documentation sources and run ‘hugo mod init’ and deleted the themes/gokarna directory. I have added the module stanza to hugo.toml:

[module]
[[module.imports]]
path = 'github.com/526avijitgupta/gokarna'

When I run ‘hugo’ or ‘hugo server’ it completes without error but the site displays with almost none of the required formatting. The CSS files for the theme are in assets/css, as verified by ‘hugo mod vendor’:

$ find _vendor/ -name "*.css"
_vendor//github.com/526avijitgupta/gokarna/assets/css/normalize.min.css
_vendor//github.com/526avijitgupta/gokarna/assets/css/dark.css
_vendor//github.com/526avijitgupta/gokarna/assets/css/main.css

I have a custom CSS file in static/css and it is just this custom file that is present in public/css:

$ ls public/css
villadetara.css

This was not the case when I was using the theme as a git submodule.

When I run ‘hugo server’ and move static/css to assets I get the following message:

adding created directory to watchlist /Users/robin/projects/web/themetest/assets/css

Change of Static files detected, rebuilding site.
2023-11-27 16:47:04.675 +0200
File no longer exists in static dir, removing css

If I move the assets/css directory back to static I get the following:

adding created directory to watchlist /Users/robin/projects/web/themetest/static/css

Change of Static files detected, rebuilding site.
2023-11-27 17:08:00.707 +0200
Syncing css to /

Here are my version and environment details:

$ hugo env
hugo v0.120.4-f11bca5fec2ebb3a02727fb2a5cfb08da96fd9df+extended darwin/amd64 BuildDate=2023-11-08T11:18:07Z VendorInfo=brew
GOOS="darwin"
GOARCH="amd64"
GOVERSION="go1.21.4"
github.com/sass/libsass="3.6.5"
github.com/webmproject/libwebp="v1.2.4"

Why is Hugo not recognising/using the CSS files in the assets directories?

2

I don’t know about modules and such. But files in assets are not “recognized” by Hugo, ever. Unless you do something with them, like feed them to resources.Get. That’s described under the “Pipes” heading in the documentation.

1 Like
3

Thank you for that pointer. I have checked the latest version of the theme and can see that the file that references the CSS files (gokarna/layouts/partials/head.html) has been updated to ‘use’ the files in the assets directory, for example:

    {{ $cssMain := resources.Get "css/main.css" | minify }}
    <link rel="stylesheet" type="text/css" href="{{ $cssMain.RelPermalink }}">

As I use a customised version of this file, I’ll update mine.

Thanks for your assistance.

4

This topic was automatically closed 2 days after the last reply. New replies are no longer allowed.