我有一个由 Rails 提供的 AngularJS (v.1.7) 应用程序。我刚从 Sprockets 搬到了 Webpack。在尝试将我的 Jasmine 测试迁移到 Jest 时。我遇到了一个问题html-loader，我用它来将我的指令模板导入指令。

对于我导入模板的一个简单指令，Jest 无法加载测试，因为html-loader失败并出现错误

我正在遵循此 SO 帖子和此 npm 包 html-loader-jest中的建议。在我的package.json中，我添加了以下jest配置

和支持文件

堆栈跟踪将我指向html-loader（来自 node_modules）

如果我在 Jest 运行期间追踪到这里，我会发现这个loaderContext未定义（如错误报告所示）。

我的问题是......这是使用它的正确方法htmlLoader吗？如果是这样，我应该期待什么loaderContext？有没有办法让开玩笑来提供这个价值？或者这不是htmlLoader应该在实际 Webpack 管道之外调用的方式。

这个问题只发生在我通过jest. webpack正确编译应用程序的所有资产。

库版本

代码（为清楚起见）

当我尝试对我的项目进行 webpack 时，我收到了这个错误，这是<link rel=stylesheet href=[object Object]>我对 CSS 样式的预期输出 ./styles.css。我是 webpack 的新手，谁能帮我解决这个问题。提前致谢。

这是我正在处理的文件：

webpack.config.common.js

索引.js 文件

webpack.config.prod.js

我已安装的插件列表：

在此先感谢克里什

我有一个 Webpack 4 项目，用这个文件夹和文件结构制作多语言管理仪表板：

i18n在开发项目时，我的文件夹中文件夹中的图像路径src是正确的，但是当我构建项目时，它会在build项目的根目录中创建一个带有自己资产文件夹的文件夹。正如您在上面的文件结构中看到的，build 文件夹中的 ltr html 文件具有放置在 build 文件夹中的 assets 文件夹的正确路径，但文件夹中的 rtl 版本fa指的是相同的路径，这是错误的。这 2 个文件基于src/i18n. 另外，两个 html 文件的标题中的所有指向图标图像的链接在文件的构建版本中保持不变，这是另一个问题，但是由 Webpack html 插件完成的其他注入链接都正确地注入了两个 html 文件中的正确路径。

这是我的生产模式的 webpack 配置 webpack.prod.js：

所以，问题是当我使用我的 webpack.prod.js 配置构建项目时，它在构建文件夹中为我提供了 2 个用于 ltr 和 rtl 方向的 html 文件，在 rtl 版本 index.html 中它会为 img 标签生成错误的 src 路径并在这两个文件都不会更改 favicon 链接的路径，并且提到的链接与源 html 文件保持相同，但注入 Webpack html 插件的其他链接都正确地注入了每个 html 文件中的正确路径。

我需要根据文件在文件夹结构中的任何级别使用正确的 img 标签 src 路径生成 2 个 html 文件。

任何帮助将不胜感激。

在 Webpack 的html-loader的 1.0.0 版本中，该interpolate选项已被弃用，取而代之的是preprocessor（根据他们的变更日志）。interpolate为 ES6 模板字符串启用插值语法，允许您在 html 文件中导入其他 html 部分，如下所示：

<div>${require('./components/gallery.html')}</div>

这是使用 html-loader 实现 html 部分的事实上的方法，因为几个堆栈溢出建议了这个解决方案。

但是，既然该标志已被弃用，我正在努力弄清楚如何使用该preprocessor选项启用它。他们的 github 页面中的示例附带了一个把手实现，但在以前的版本中您不需要这个 - 使用插值require语法，这一切都是开箱即用的。

有人设法使用最新版本的 html-loader 复制此 html 部分设置吗？

我正在尝试使用 webpack 4 构建静态 html 页面。我正在使用html-webpack-plugin。我想定义一些header.html和footer.html并稍后在所有 html 页面中导入它们。但我还希望我的输出 js 和 css 文件自动注入到这个页眉和页脚。像这样的东西：

header.html：

页脚.html：

index.hbs（或 index.html）：

但是我在dist/index.html中遇到了一些错误。这些行仍然相同，并且不会将页眉/页脚加载到 index.html：

由于某种原因，lodash 不起作用......

升级版：

我改为src/html/views/index.hbs（src/html/views/index.html 并在插件中）

在此处添加include行：

在页眉/页脚中，我删除了 lodash 代码<% ... %>，只留下干净的 html - 所以它可以工作！在 index.html 中导入页眉/页脚，但没有 css/js。

如果我在footer.html（或header.html）中返回lodash

我得到错误：

为什么会发生？怎么了？如何使 lodash 在页眉/页脚中工作？

或者生成 html 模板的最佳方法是什么？

文件树：

webpack.config.js：

包.json：

我在学习 webpack 时遇到了loaders，它的定义loaders说它会转换你的代码，以便它可以包含在 javascriptbundle中。

但是，html-loader 是如何工作的？

定义说它将 html 导出为字符串（这html-loader是什么意思）。

它还说每个可加载的属性（例如<img src="image.png"导入为require('./image.png')，并且您可能需要在配置（file-loader或url-loader）中为图像指定加载器，这是什么意思。

我想知道，html-loader 到底做了什么。它是转换html为 String 还是只是将img标签转换为require. 这一切如何协同工作。

谁能详细解释一下。

有没有人让 Webpack/html-loader 来处理锚标签（href 属性）中的图像引用？我正在使用以下 webpack 配置，当包含以下注释行时，该配置会引发错误“回调已被调用”：

当上面的行被注释掉时，所有的编译和标签都得到了正确的处理，但是标签缺少它们的图像。

这些是我正在使用的相关软件包版本：

• 网络包：4.43.0
• html-loader: 1.1.0
• 文件加载器：6.0.0

我已经html-loader在我的 Webpack 配置文件上实现了：

当我尝试使用以下行运行 webpack dev-serverindex.js

它返回以下错误：

我试图记录所有被扫描的文件，似乎 Webpack 甚至没有检查app我src文件夹中的整个目录：

唯一打印的 HTML 文件是index.html，它位于webpack文件所在的目录中。

我的目录：

我将 Webpack 与 html-loader 一起使用，但由于他们删除了该interpolation选项，我的旧项目无法遵循更新。有多个项目，因此将它们全部升级到新方式将花费太多精力。

有没有办法将此语法与preprocessor选项一起使用？