How to use templates with angular 1.x and webpack - angularjs

Question

Im trying to use webpack with my angular app but whenever I try loading in the html to the template I get errors. This is the one I'm currently getting:
Module parse failed: C:\Users\Fabian\Dropbox\FixMyCity\FixMyCity\src\FixMyCity.Web\App\settings\settings.html Unexpected token (1:0)
You may need an appropriate loader to handle this file type.
Which makes me think that I don't have the right loader for html, but i've tried it with both raw-loader and html-load and neither of them have worked for me.
Here is my current webpack.config.js
module.exports = {
entry: './App/app.js',
output: {
filename: './wwwroot/app-bundle.js'
},
loaders: [
{ test: /\.html$/, loader: 'html' },
{ test: /\.css$/, loader: 'style!css' },
]
};
app.js
var app = angular.module('app', ['auth0', 'angular-storage', 'angular-jwt', 'ngRoute'])
.config(['$routeProvider', 'authProvider', 'jwtInterceptorProvider', '$httpProvider', configFunction])
function configFunction($routeProvider, authProvider, jwtInterceptorProvider, $httpProvider) {
// Configure routes for your application
$routeProvider
.when('/', {
controller: 'HomeCtrl',
template: require('./home/home.html'),
requiresLogin: true
})
}

Answer 1

You must install html-loader from npm, after that you have to put in property loader the value 'html-loader'.
Like this:
module.exports = {
entry: './App/app.js',
output: {
filename: './wwwroot/app-bundle.js'
},
loaders: [
{ test: /\.html$/, loader: 'html-loader' },
{ test: /\.css$/, loader: 'style!css' },
]};