# How to use files from /assets in scss

**URL:** https://discourse.roots.io/t/how-to-use-files-from-assets-in-scss/8521
**Category:** sage
**Created:** 2017-01-10T21:36:25Z
**Posts:** 5

## Post 1 by @psorensen — 2017-01-10T21:36:25Z

In my scss, I reference a file from the `/assets` folder like so:

```
.selector {
    background-image: url(../../images/svg/gears.svg);
}
```

Everything’s fine using `yarn run start` and `yarn run build`. However, when executing `yarn run build:production` the following error is thrown:

```
ERROR in ../~/css-loader?-sourceMap!../~/postcss-loader!../~/resolve-url-loader?-sourceMap!../~/sass-loader?-sourceMap!./styles/main.scss
    Module not found: Error: Can't resolve '../../images/svg/gears.svg' in '/Applications/MAMP/htdocs/openminds/wp-content/themes/hoang/assets/styles'
     @ ../~/css-loader?-sourceMap!../~/postcss-loader!../~/resolve-url-loader?-sourceMap!../~/sass-loader?-sourceMap!./styles/main.scss 6:194746-194783
```

How can I properly reference the assets folder so that it doesn’t break `yarn build:production`?

---

## Post 2 by @ben — 2017-01-10T22:06:30Z

Use `../images`, not `../../images`

---

## Post 3 by @psorensen — 2017-01-10T22:09:32Z

duh! forgot that it’s technically being referenced by `main.scss`, not the included file. Thanks @ben

---

## Post 4 by @dangelion — 2020-11-12T16:06:31Z

Hi @ben  
I’m actually using the correct syntax but I get error

```
Module build failed: Error: resolve-url-loader: CSS error
  predicate must return an absolute path or the result of calling next()
```

More details here:

> [@Relative paths to images in CSS doesn't work anymore (ie. background-image path)](https://discourse.roots.io/t/relative-paths-to-images-in-css-doesnt-work-anymore-ie-background-image-path/19431/6):
>
> @alwaysblank There’s something real wrong here. I reinstalled Sage 9.0.10, fresh and clean via composer 1.7.2. Then yarn, yarn build and yarn start (I use node 10.22.1, just because reinstalling Sage it installed 9.0.10 that requires node 10. Anyway at the time I was writing first post I used Sage 9.0.9 with node 8.17 and I had same exact error). Put an image in resources/assets/images/bg.jpg. Add in resources/assets/styles/main.scss the line body { background-image: url(../images/bg.jpg); } (…

Any idea? I’m spending hours and hours not finding solution :frowning:

---

## Post 5 by @internetom — 2021-04-04T16:17:46Z

I’m running into the same issue with the exact same error. It seems to not mind when I remove the quotes but doesn’t render on the page.