Saas Assets - URL failed resolution [Resolved]

I’m currently working on various improvements to my website on www.techmaxsolucoes.com.br

With Frappe we can add nodejs modules and reference those modules, during the asset build and that works so far, so great.

But, I have a situation that is being hard to me, because I didnt understand how the asset resolution works on the building process.

First of all I have the following structure

  • /app/public/scss/theme/something.scss
  • /app/public/scss/base/another.scss
  • /app/public/scss/other/finally.scss
  • /app/public/fonts/
  • /app/public/svgs/

On my scss/theme/something.scss I have this import

@font-face {
  font-family: 'Unicons';
  src: url('../../fonts/unicons/Unicons.woff2') format('woff2'),
    url('../../fonts/unicons/Unicons.woff') format('woff');
  font-weight: normal;
  font-style: normal;
  font-display: swap;
}

I’m pretty sure, the relative path, points properly to the file I wanna, basedly on the actual position of the scss/theme/something.scss but I still continue receiving errors during the build, telling me it failed to resolve the path to ../../fonts/unicons/Unicons.woff2

Does someone had to deal with this kind of problem before?

check if this post helps: How to import css file from node_modules? - #2 by VINOTH

@revant_one thanks for point me out to this!

However, my problem is not related to node_modules

I think I haven’t been clear, let me explain again!

This is my project hierarchy

On public/fonts I have this

image

Under public/scss/theme/_icons.scss I do have the following entry

Considering that I’m in public/scss/theme/_icons.scss and I wanna access public/fonts/unicons/Unicons.woff I’m using the ../../ into the relative path of the URL

But, when I run bench build I’m facing this

Sounds after the generation of the bundle, the URL should be relative to the folder scss but, if I change the path to ../fonts this will happen

So, literally, I dont have idea about from which path it’s using as relative path!

I also tried to move the content inside scss folder and this happens

The files are literally on the same folder

image

But still, it’s always unable to resolve

I solved using non relative paths

1 Like