Webpack не анализирует <%= htmlWebpackPlugin.options.header %> в документе HTML. В теге <title> я использовал переменную <%= htmlWebpackPlugin.options.header %>, но она печатает ее как строку, т.е. "‹%= htmlWebpackPlugin.options.header %>".
Мой веб-пакет выглядит так:
const glob = require('glob');
const path = require('path');
const CopyWebpackPlugin = require('copy-webpack-plugin');
const HTMLWebpackPlugin = require('html-webpack-plugin');
const MiniCssExtractPlugin = require('mini-css-extract-plugin');
const generateHTMLPlugins = () =>
glob.sync('./src/**/*.html').map(dir =>
new HTMLWebpackPlugin({
filename: path.basename(dir), // Output
template: dir, // Input
title: 'HTML Wesdsdsdin',
header: '<h1>hello world</h1>',
}));
module.exports = {
node: {
fs: 'empty',
},
entry: [
'./src/js/app.js',
'./src/style/main.scss'],
output: {
path: path.resolve(__dirname, 'dist'),
filename: 'app.bundle.js',
},
module: {
rules: [
....
],
},
plugins: [
.....
...generateHTMLPlugins(),
],
stats: {
colors: true,
},
devtool: 'source-map',
};
По сути, я хочу сделать частичные компоненты верхнего и нижнего колонтитула и внедрить их с помощью веб-пакета. Пожалуйста, предложите мне правильный путь.
