Using html-loader
with interpolate
, you can import variables from your webpack.config.js
by using DefinePlugin
.
// webpack.config.js:
module.exports = {
module: {
rules: [
{
test: /\.html$/,
loader: 'html-loader',
options: {
interpolate: true
}
}
],
},
plugins: [
new DefinePlugin({
VARNAME: JSON.stringify("here's a value!")
})
]
};
// index.html
<body>${ VARNAME }</body>
html-loader
's interpolations accept any JavaScript expression, but the scope that those expressions are evaluated in aren't populated with any of your configuration options by default. DefinePlugin
adds values to that global scope. EnvironmentPlugin
could also be used to populate values in process.env
.