CSS image url in an npm package

255 Views Asked by At

I have a package that I am using in my main webpack-built app. In the package, I have a component with its corresponding .scss file. The folder structure is:

component
   |- assets
       |- background-image.svg
   component.tsx
   component.scss

component.scss is trying to use background-image as such:

background: url('assets/bacgkround-image.svg')

This works fine in a storybook file and the background is loaded properly.

However, when I try to include the component in my main React app, the build fails with the following error:

Module not found: Error: Can't resolve './assets/background-image.svg' in '<path-to-my-package-directory'

I am confused. What is the right way to include the image from a relative url in a css file?

0

There are 0 best solutions below