File to import not found or unreadable: userstyles.scss.

[UzairQamarxyz]

I keep getting the following error when trying to use a userstyles.scss file.

Error: error building site: TOCSS: failed to transform "css/style.css" (text/x-scss): "/home/uzair/Documents/git/test/themes/hermit-v2/assets/scss/style.scss:10:1": File to import not found or unreadable: userstyles.scss.

I have my userstyles.scss file under assets/scss/ as per the README but I see that userstyles.scss is being checked at assets/scss/userstyles.scss and then it tries to import userstyles.scss from the project root.

https://github.com/1bl4z3r/hermit-V2/blob/630960e61554ebfbd51102b2fbcc0449761167a8/assets/scss/style.scss#L9-L11

If I create an empty userstyles.scss in assets/scss/ folder and have the actual one at the project root then things work fine.

[1bl4z3r]

Hi @UzairQamarxyz, This doesn't look right. I have to check that.

[UzairQamarxyz]

I found the issue causing this. It was this line in my hugo.toml file.

assetDir = "static"

I had added this line because for some reason I keep getting this error without it.

ERROR The resource "/images/test.png" passed to the "figure" shortcode could not be found.

Here's the <figure> in question.

{{< figure src="/images/test.png" caption="<span class=\"figure-number\">Figure 1: </span>Test Image" class="big" >}}

The image is located in static/images/test.png

Anyways this issue was invalid so I'll be closing it.

[1bl4z3r]

Hi @UzairQamarxyz,

Your resolution doesn't explain the issue completely. Why did you had to enter assetDir = "static", when assetDir is already set to assets by default?

[UzairQamarxyz]

No idea tbh. I only started using Hugo 2 days back.

I just tried with a fresh hugo site and got the issue.

Here are the steps to reproduce:

1. Create a new site

hugo new site test
cd test
git init

2. Add hermit-v2 as a submodule and set up hugo.toml

git submodule add -b main https://github.com/1bl4z3r/hermit-V2 themes/hermit-v2
cp themes/hermit-v2/hugo.toml.example ./hugo.toml

#baseURL = "CHANGE BASE URL"
defaultContentLanguage = "en"
defaultContentLanguageInSubdir = true
theme = "hermit-v2"
...
# [params.author]
#   name = "CHANGE SITE AUTHOR"
#   about = "CHANGE SITE AUTHOR ABOUT"

3. Add a new post

mkdir content/posts/
echo '+++
title = "Test"
author = ["Test"]
lastmod = 2024-02-19T15:52:46+05:00
tags = []
draft = false
+++

{{< figure src="/images/test.png" class="big" >}}' > content/posts/test.md

4. Add an image to assets/images/test.png
5. Run hugo server

hugo server -D
Watching for changes in /home/uzair/Documents/test/{archetypes,assets,content,data,i18n,layouts,static,themes}
Watching for config changes in /home/uzair/Documents/test/hugo.toml
Start building sites …
hugo v0.122.0+extended linux/amd64 BuildDate=unknown

ERROR The resource "/images/test.png" passed to the "figure" shortcode could not be found. See "/home/uzair/Documents/test/content/posts/test.md:9:1"
Built in 21 ms
Error: error building site: logged 1 error(s)

[1bl4z3r]

Hi @UzairQamarxyz,

If I understand it correctly, an image file is in assets/images/test.png and you are trying to get image from /images/test.png.

You can correct me if I'm wrong, however when you do that, it signifies that there is a image in images directory in root; but it isn't.

You may try to re-create the issue by editing figure shortcode as below

{{< figure src="images/test.png" class="big" >}}

[UzairQamarxyz]

Oh damn! I'm dumb :p

Can't believe I missed that. I was using ox-hugo to export my org files to hugo compatible hugo mds, ox-hugo stores images in the static folder instead of assets and I didn't even notice that.

Thanks @1bl4z3r and sorry for the trouble!

[1bl4z3r]

No worries. It's something we all need to be careful about. Original hermit theme uses assets directory for everything (well except for somethings 😅). Also hermit-V2 allows for on-the-fly conversion to webp for image media, so keeping images in assets became a necessity.

Hope this helps and hope that you would be using hermit-V2 in your future endeavors.