如何使用webpack与静态图像文件？

Question

我使用webpack捆绑.vue文件,使用import和export.Webpack创造了一个很好的bundle.js,这一切都很好,花花公子.

但是当我的Vue文件提到图像时,例如:

<div>
     <img src='./images/thing.png'>
</div>

.style {
   background: url('./images/anotherthing.png');
}

现在,突然这个图像也需要在我的dev文件夹中,webpack想要在每次更新一个javascript文件中的一个字符时复制我的所有图像文件.此外,并非所有我的图像都以这种方式导入,因此我必须手动将一些文件复制到dist文件夹,而webpack也会复制一些文件...

我可以告诉webpack不要捆绑永不改变的静态图像文件吗？这甚至是推荐的吗？

Answer 1

Webpack 有一个file-loader可以处理复制静态依赖项并正确解析它们的 URL：