我应该如何处理"module.exports ='html_template_content'"?在webpack上 [英] What exactly am I supposed to do with "module.exports = 'html_template_content'" on webpack

问题描述

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

So I want to do a very simple task using webpack.

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

I have a few static HTML templates like e.g.

test.html

test.html

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

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

and all I want to do is return the string inside the template e.g

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

with应该返回类似以下的字符串:

with should return a string like:

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

但是，它返回以下字符串

but instead, it returns the following string

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

我尝试了几个模块，例如raw-loader和html-loader. 它们都以相同的方式工作.所以我看了一下源代码，只是发现其应该以这种方式工作.

I have tried several modules, like the raw-loader and html-loader. and they both behave the same way.So I took a look at the source code, just to find out that its SUPPOSED to behave this way.

如果我只想要原始的内容，那么我应该怎么做呢? HTML?删除前置字词是不好的做法吗 "module.exports ="字符串?从捆绑中 删除'modules.export ='部分导致捆绑包不返回任何内容:/

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" }
            ]
    }
};

推荐答案

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

The solution is to require your file without specifying any additional loader, as this is already specified in the webpack config

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

说明:使用当前代码，您将两次raw加载程序应用于文件.当您在配置中指定加载程序链时:

Explanation: With your current code, you are applying the raw loader twice to your file. When you specify a loader chain in your configuration:

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

...您已经在告诉webpack每次需要与test条件匹配的文件(此处为每个html文件)时将此加载器添加到加载器链中.

... you are already telling webpack to add this loader to the loader chain every time you require a file matching the test condition (here, every html file)

因此，当您编写本文时

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

...实际上等效于此

... it is actually equivalent to this

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

这篇关于我应该如何处理"module.exports ='html_template_content'"?在webpack上的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！