Andrew Willems Andrew Willems - 10 months ago 48
HTML Question

What does this single line of webpack html loader syntax mean?

To solve a problem I was having with my

file I copied a line from a webpack blog. The line is starred in the code below. However I can't seem to easily figure out what the line is doing and googling didn't lead me to a simple explanation. So, what is the purpose/syntax of the indicated line? A short explanation would probably suffice, but a link to some (official) documentation would also be helpful.

var path = require('path');

module.exports = {
entry: {
javascript: ['babel-polyfill', './src/main.js'],
html: './index.html'
output: {
path: path.join(__dirname, 'build'),
filename: 'bundle.js'
devtools: 'inline-source-map',
module: {
loaders: [
loader: 'babel-loader',
test: path.join(__dirname, 'src'),
query: {
presets: ['react', 'es2015', 'stage-2']
test: /\.html$/,
loader: 'file?name=[name].[ext]' // <---- **********


The webpack file loader lets you specify a custom filename template for imported files using the name= query parameter: