我应该“需要”一个静态图像

问题描述：

我开始配置webpack，我不知道处理静态图像的正确方法，我看到了多种方法。我应该“需要”一个静态图像

我可以创建静态文件的目录，然后将静态文件与复制的WebPack-插件复制。我的目录结构看起来像这样：

src/modules/login/components/loginPage.html 
static/images/logo-login.png

我可以依靠HTML装载机我的图片URL转换为需要声明，在我的代码旁边包含我的图像。我的目录结构将最终为：

src/modules/login/components/loginPage.html 
src/modules/login/components/logo-login.png

是否有正确的方法？在两者之间有没有优点&（从功能上讲，它们的行为会不同，因为需求方法会嵌入图像）？还是仅仅是个人偏好？

开始=“2”>

请勿使用copy-webpack-plugin。 Webpack旨在为您提供对图像等静态资产依赖关系的实际管理。它使用源代码中的require（）来实现这一点。进一步阅读：http://blog.andrewray.me/webpack-when-to-use-and-why/ –

答

您应该尝试通过require声明引用所有资产。这将与Webpack的模块加载相结合，您将能够配置资产在最终作为JS模块通过模块加载器公开之前的转换方式。例如，您可能希望使用原始图像进行开发，但为I/O优化它们并为不同的媒体创建集合。

copy-webpack-plugin允许您直接从上下文向构建输出中添加文件，而不将它们视为依赖关系图中的模块。这对于可以由服务器直接提供的文档有效，例如robots.txt，各种设备的证明，某些其他进程生成的本地内容等。

您需要同时使用两个文件，但copy-webpack-plugin有特定用途。