Typescript 2.0 and Webpack importing of HTML as string

Question

I'm trying to import a HTML file as string with the help of webpack (Currently using webpack because TypeScript 2.0 doesn't support async/await on non ES6 targets).

The problem I have is, even if the html-loader version from github supports a config flag 'exportAsEs6Default' i don't get it to set correctly. Is there any way to set a loader options globally? Because if I add the html-loader to the loaders section in the config file the loader is called twice causing the content to be nested.

---

I have the following definition file to support importing of HTML (like in the example on the modules documentation)

declare module "html!*" {
    const content: string;
    export default content;
}

The corresponsing import statement:

import templateString from "html!./Hello.html";

The versions of the packages I use:

"babel-core": "^6.17.0",
"babel-loader": "^6.2.5",
"babel-preset-es2015": "^6.16.0",
"html-loader": "git://github.com/webpack/html-loader.git#4633a1c00c86b78d119b7862c71b17dbf68d49de",
"ts-loader": "^0.9.5",
"typescript": "2.0.3",
"webpack": "^1.13.2"

And the webpack config file

"use strict";

module.exports = {
    entry: "./WebApp/Hello.ts",
    output: {
        path: "./wwwroot/compiled",
        filename: "app.bundle.js"
    },
    resolve: {
        extensions: ["", ".webpack.js", ".web.js", ".js", ".ts"]
    },
    module: {
        loaders: [
            {
                test: /\.ts$/,
                exclude: /node_modules/,
                loader: "babel-loader!ts-loader"
            },
            {
                test: /\.js$/,
                exclude: /node_modules/,
                loader: "babel-loader"
            }
        ]
    }
};

Answer 1

So after some tinkering I found a way to get this done. As i didn't want to add a 'exportAsEs6Default' query parameter to every import statement, I changed from an explicit loader for html to a configured loader.

I'll leave this question open in case someone knows a better way, as currently I'm not sure if I'm all to happy with this way (something native to typescript would be find without the need of a loader), but maybe it will help others facing the same problem.

---

So the import statement from the example above changed to

import templateString from "./Hello.html";

Together with an updated definition file

declare module "*.html" {
    const content: string;
    export default content;
}

And the webpack config file changed to this:

"use strict";

module.exports = {
    entry: "./WebApp/Hello.ts",
    output: {
        path: "./wwwroot/compiled",
        filename: "app.bundle.js"
    },
    resolve: {
        extensions: ["", ".webpack.js", ".web.js", ".js", ".ts", ".html"]
    },
    module: {
        loaders: [
            {
                test: /\.ts$/,
                exclude: /node_modules/,
                loader: "babel-loader!ts-loader"
            },
            {
                test: /\.js$/,
                exclude: /node_modules/,
                loader: "babel-loader"
            },
            {
                test: /\.html$/,
                exclude: /node_modules/,
                loader: "html-loader?exportAsEs6Default"
            }
        ]
    }
};

No change to the used packages.