Home > Enterprise >  How to load images in webpack 5 without using JavaScript
How to load images in webpack 5 without using JavaScript

Time:04-17

I hope this question is not completely stupid. I am currently building a website using only plain HTML in Webpack. When I try to load images as usual, using the img tag and the src attribute, my images are not displayed. I found this in the webpack documentation. But there it only describes how I load images via JavaScript.

webpack Documentation

CodePudding user response:

You need to specify image urls as described in the documentation. Then, Webpack will bundle everything together, place your images in the output folder and generate the final URL.

Now, when you import MyImage from './my-image.png', that image will be processed and added to your output directory and the MyImage variable will contain the final URL of that image after processing.

Webpack uses JS to process all the files, however JS may not be needed to load the images on the page.

CodePudding user response:

For all those who have a similar problem. You must first load the html-loader to be able to load images in your HTML files.

  • Related