如何在不使用 JavaScript 的情况下在 webpack 5 中加载图像

How to load images in webpack 5 without using JavaScript

我希望这个问题不是完全愚蠢。我目前正在 Webpack 中仅使用纯 HTML 构建网站。当我尝试像往常一样加载图像时,使用 img 标签和 src 属性,我的图像没有显示。我在 webpack 文档中找到了这个。但那里只描述了我如何通过 JavaScript.

加载图像

webpack Documentation

您需要按照文档中的说明指定图片网址。然后,Webpack 会将所有内容捆绑在一起,将您的图像放在输出文件夹中并生成最终的 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 使用 JS 来处理所有文件,但是可能不需要 JS 来加载页面上的图像。

对于所有遇到类似问题的人。您必须先加载 html-loader 才能加载 HTML 文件中的图像。