9

I have written a simple template

test.html

<div>raw text with content</div>

all I want to do is requiring the raw file, with no modifications

like 

require('./test.html'); // should return "<div>raw text with content</div>"

I have tried loading the html using the extra-text-plugin, but it doesn't work

var ExtractTextPlugin = require('extract-text-webpack-plugin'); 

module.exports =
{
    module:
    {
        loaders:
            [
                { test: /\.html$/, loader: 'html' }
            ]
    },
    plugins: [
        new ExtractTextPlugin("[name].html")
    ]
};
user3531149
  • 1,519
  • 3
  • 30
  • 48
  • Don't use Webpack as a build system - **it is not**. Webpack is a module bundler for JS and your static assets that you use **in it**. – Kreozot Aug 01 '16 at 07:43
  • By the way - webpack perfectly well working with gulp/grunt. – Kreozot Aug 01 '16 at 07:45

1 Answers1

10

Try to use html-loader:

 import TestTemplate from 'html!./test.html';
stdob--
  • 28,222
  • 5
  • 58
  • 73
  • Why does it return "exports = template_content" instead of just the template content? how am I supposed to fetch the content – user3531149 Jul 31 '16 at 19:23
  • 1
    He did not have TestTemplate in his file!!!! Why everyone is saying import template form file.html in all answeres. There is no export in html file. – Ali Khosro Feb 25 '19 at 18:39
  • 1
    @AliKhosro because it's using html-loader.... Which basically puts your html in an export – Tofandel Mar 08 '22 at 11:17
  • import TestTemplate from 'html-loader!./test.html'; is current convention. There is no need for extra config. – Sasha Firsov Dec 16 '22 at 08:32