node.js - 我到底应该如何处理 webpack 上的 "module.exports = ' html_template_content'"

Question

所以我想用 webpack 做一个非常简单的任务。

我有一些静态 HTML 模板，例如

test.html

<div><span>template content</span></div>

我想要做的就是返回模板内的字符串例如

require("raw!./test.html")

with 应该返回一个类似的字符串:

"<div><span>template content</span></div>"

但相反，它返回以下字符串

"modules.exports = <div><span>template content</span></div>"

我尝试了几个模块，例如 raw-loader 和 html-loader。并且它们的行为方式相同。所以我查看了源代码，只是为了发现它的 SUPPOSED 行为方式。

so what exactly am I expected to do with this, if I just want the raw HTML? is it a bad practice just to remove the prepended "module.exports =" string? from the bundle edit: removing the 'modules.export =' part results in the bundle returning nothing :/

我的配置

module.exports =
{
    module:
    {
        loaders:
            [
                { test: /\.html$/, loader: "raw-loader" }
            ]
    }
};

Answer 1

解决方案是在不指定任何其他加载程序的情况下要求您的文件，因为这已在 webpack 配置中指定

const test = require('./test.html')

说明:使用您当前的代码，您将两次应用 raw 加载器到您的文件。当您在配置中指定加载器链时:

loaders:
    [
        { test: /\.html$/, loader: "raw-loader" }
    ]

...你已经在告诉 webpack 每次你需要一个匹配 test 条件的文件(这里是每个 html 文件)时都将这个加载器添加到加载器链中

因此，当你写这个

const test = require('raw!./test.html')

...其实等价于这个

const test = require('raw!raw!./test.html')