search

ctrlplusb / react-universally

A starter kit for universal react applications.
MIT License
1.7k stars 244 forks source link

Images in CSS not being processed by Webpack #537

Closed oyeanuj closed 6 years ago

oyeanuj commented 6 years ago

Hi folks, I'm stuck on this issue where the images specified in the CSS are not being picked up or processed by Webpack.

.img {
  background: url('./logo.png');
}

It works if I import an image and then use that as a src to an img tag. From #15, it seems like this should work but I am unable to achieve that.

Has anyone gotten this working or run into the same problem?

unleashit commented 6 years ago

It's working for me. CSS background images are output to /build/client and served from /client. Are you sure you have the correct path? The way you wrote it would mean that the image would need to be in the same directory as that CSS file.

What feature branches (if any) are you using? I started with posscss-sass which has a modified webpack config compared to master, so maybe take a look at the image loader there if you're still having problems.

oyeanuj commented 6 years ago

@unleashit It turns out that my issue was that I needed to import the image for the CSS, unlike in previous setups with CSS modules where files mentioned are self-parsed.

unleashit commented 6 years ago

Huh, not for me. It works fine out of the box. I am using CSS Modules on my React Universally project, but in other projects I'm not. Didn't know it was possible to use import/require from within a CSS file.