问题标签 [webpack-file-loader]
For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.
angular - 在 Angular 2 中使用 webpack 文件加载器
我正在进入 Angular 2 和 webpack，我对如何使用file-loader引用图像有点困惑。据我所知，您不能require()像这样直接将 a 放入您的 html 中：
我能够让它工作的唯一方法是创建一个类成员并引用它的 html。
我的.component.ts：
html:
这是您期望将文件加载器与图像一起使用的方式吗？
javascript - Webpack 2 - 文件加载器 [路径] 选项
我使用 webpacks 文件加载器从 pug 模板文件夹中输出一堆已编译的 html 文件。
我想将 html 文件放在输出目录中，与它们在源/pug/文件夹中时所在的文件夹结构相同，减去 pug 文件夹本身。
例如，如果在/pug/文件夹中，其中一个文件是/pug/layouts/index.pug，另一个文件是/pug/templates/main/index.pug，我试图将输出的 html 文件发送到/dist/layouts/index.html和/dist/templates/main/index.html
我正在使用file-loader?name=[path][name].html，但这会导致文件，例如/dist/pug/layouts/index.html- 注意哈巴狗文件夹。我不知道如何摆脱它，有什么想法吗？
webpack - 使用哈希的文件名以避免缓存
[名称].[分机]?[哈希]
我对表达式有两个问题：
- 这如何有助于避免浏览器中的缓存？
- 实际上在 Windows 操作系统中，它会发出一个名为[name].[ext]的文件，没有?[hash]部分。所以，这不是一个好的解决方案吗？
webpack - 如何在 webpack 中配置 url-loader 以仅转换某些文件夹？
webpack.js
file.jpg：通过 url-loader 转换为 base64
file.png：使用文件加载器
只需使用 ext 来决定项目中的所有 file.jpg 进行转换。</p>
但是如何处理file.gif？
确实我想知道如何在 webpack 中配置 url-loader 以仅转换某些文件夹或某些文件？但不仅仅是某些类型的所有文件。
对不起，我的英语很差...
webpack - webpack 的文件加载器没有将 src 文件夹图像文件移动到 dist 文件夹
我将此配置添加到通过将上述规则添加到webpack.config.js中来使用file-loader
部分，但没有图像文件移动到dist/文件夹，即使我将图像文件放入src/images/. 有什么我错过的东西需要添加到 webpack 配置中吗？
我正在遵循https://julienrenaux.fr/2015/03/30/introduction-to-webpack-with-practical-examples/中的示例
顺便说一句，我正在使用 webpack 2... 现在有不同的方式来配置文件加载器吗？
这是整个 webpack 配置文件
webpack - 将图像链接传递到组件时，出现“意外字符”错误（Webpack、Babel）
在我的 React 应用程序中，我可以在任何地方很好地导入图像，除了我尝试将图像路径传递给组件的一个地方。
然后在我的父组件中：
当我尝试构建它时，我得到了
这是我的 Webpack 图像加载器配置：
知道是什么原因造成的吗？
编辑：这些也是我的 babel 设置：
]
javascript - 需要帮助使用相对/绝对路径修复 webpack.config
我正在尝试使我的 webpack.config 与子文件夹中的图像一起使用。我遇到了麻烦。我花了最后一天半的时间在互联网上搜索并阅读各种解决方案，但无济于事。
我的 src 文件是：
/src/图像/数据/
/src/容器
我的问题是：我有一条路由：http://localhost:7771/games/O从 /src/containers 加载 在该页面上，我正在尝试加载 /src/images/data/NotFound.png
如果我使用：调用图像，
<img src="../images/data/NotFound.png"/>则图像显示没有任何问题。
但是，如果我将路径更改为，<img src={require("../images/data/NotFound.png")}/>则图像不会显示。当我使用 Chrome 开发人员工具检查图像时，我看到该元素显示为：
<img src="images/data/NotFound.png">
如果我悬停 src 链接，我会看到：http://localhost:7771/games/images/data/NotFound.png
但是如果我尝试打开它链接，图片加载不出来。
如果我改为导航到http://localhost:7771/images/data/NotFound.png，则会加载图像。
我尝试使用别名进行解析并将图像更改为<img src={require("~/data/NotFound.png")}>但结果相同，图像未加载。
这就是为什么我认为我的 webpack.config 搞砸了，我需要一些帮助来找出它有什么问题，以便我的图像可以显示。
html - 带有程序化 img src 的 WebPack HTML 和文件加载器
我正在使用 WebPack 2，我们正在尝试使用 Vue 以编程方式指定图像名称，并将其绑定到 HTML 中。由于图像名称和路径直到运行时才绑定，因此 HTML 和文件加载器不会重写 url。
有没有办法告诉 HTML/文件加载器“在运行时可能需要任何 [这些文件]”，而不仅仅是将它们放在文件复制插件的列表中？
它以书面形式传递给客户端，然后 Vue 在运行时绑定 ${random}，当然图像不在应用程序中。
谢谢
css - Webpack - 文件加载器 - 父目录 + 不同的服务路径
晚上好，
assets/images/myimg.png给定位于（或）的图像/字体文件assets/fonts/myfont.woff.....
我希望 webpackfile-loader在不同的目录（）中创建一个散列版本../priv/static/fonts/myfont.woff......
但我不希望该名称成为“文件的服务资产路径”的一部分。
如果我使用如下所示file-loader的name选项："../priv/static/fonts/[name]-[hash].[ext]"，该文件最终会出现在我的文件系统中的正确位置。
但是当从 CSS 中引用时，浏览器正在寻找的完整路径是http://mysite.dev/priv/static/fonts/myfile-fee66e712a8a08eef5805a46892932ad.woff. 我的 Web 服务器提供来自 的静态文件priv/static，因此我希望请求的路径看起来像http://mysite.dev/fonts/myfile-fee66e712a8a08eef5805a46892932ad.woff。
我正在提交assets/images并assets/fonts进行源代码控制，因此我不希望所有散列文件最终都在该目录中。
您能提供的任何帮助将不胜感激！
