使用 webpack 从 html 文件加载挖空模板

Question

我正在尝试从外部文件加载我的挖空模板。
我的设置如下：

• npm
• webpack
• 打字稿

现在，我尝试了几个不同的选项，但 none 奏效了：

文本加载器/原始加载器/html-加载器

template: require("text-loader!./my-component.html")
// or
template: require("raw-loader!./my-component.html")
// or
template: require("html-loader!./my-component.html")

没有工作，因为这个 returns 类似于 Javascript 代码的文本，其中包含我的模板。

knockout-template-loader

template: require("knockout-template-loader!html-loader!./my-component.html")

没有工作，因为它只是 returns 一个空对象。

script-template-loader

template: require("script-template-loader?addToDom=true!./hello.html")

这有两个问题：

1. 模板不喜欢 HTMLScriptElement 对象
2. 生成的脚本除了字符串[object Object]
外没有实际内容

require 选项

template: {require: "text-loader!./my-component.html"}

没有工作，因为我在运行时遇到错误：

Cannot read property 'call' of undefined at __webpack_require__

我错过了什么？

Answer 1

html-loader 插件确实有效。为什么一开始它不起作用是因为我在我的 webpack.config.js 中注册了 knockout-template-loader 作为 html 文件的默认加载器。
看起来它正在使用它，即使在要求中指定了特定的加载器。
删除该规则后，它现在可以使用了