Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Make this plugin work with 'css-loader' #56

Open
iampava opened this issue Jul 19, 2021 · 3 comments
Open

Make this plugin work with 'css-loader' #56

iampava opened this issue Jul 19, 2021 · 3 comments

Comments

@iampava
Copy link
Owner

iampava commented Jul 19, 2021

Unfortunately this plugin doesn't "play nice" with css-loader.

Trying to use .webp images from CSS will fail unless the url: false option is set for css-loader. For example, this code:

body {
  backgrund-image: url('/assets/cover.webp')
}

will fail since initially only cover.jpg exists, and cover.webp is created dynamically by this Plugin.

Potential fixes:

  1. use url: false option for css-loader (however this might be incompatible if your projects depends on creating the assets via this loader)
  2. have a pre-webpack step which generates the images, not part of the Webpack config. This way, the .webp files exist beforehand.

Option 2 will take some work so please up-vote this issue, this way I know how many people are affected by this problem and can prioritize accordingly.

@Alfred-wen
Copy link

How is it going?

@osartun
Copy link

osartun commented Mar 14, 2023

For me it also doesn't work in a JS file with require('./images/imgname.webp'). It complains as well:

Module not found: Error: Can't resolve './images/imgname.webp' in '{local path}'

@haseeb-dc
Copy link

I have been waiting for sometime for this can you please provide some update

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

4 participants