@Grione

Как динамически обрабатывать html страницы с помощью html-webpack-plugin?

Пытаюсь динамически обрабатывать страницы с помощью html-webpack-plugin. Раньше этот код даже работал. Но после обновлений npm и соответственно плагинов перестал работать (

const HtmlWebpackPlugin = require('html-webpack-plugin');
const { CleanWebpackPlugin } = require('clean-webpack-plugin');
const MiniCssExtractPlugin = require('mini-css-extract-plugin');
const path = require('path');
const fs = require('fs');
const CopyWebpackPlugin = require('copy-webpack-plugin');

const demos = fs
	.readdirSync(__dirname + '/src/demos')
	.filter((file) => file.includes('.html') || file.includes('.ejs'));

const demosPlugins = demos.map((demo) => {
	return new HtmlWebpackPlugin({
		filename: demo.replace('.ejs', '.html'),
		template: path.resolve(__dirname, 'src', 'demos', demo)
	});
});

module.exports = (env, argv) => ({
	entry: path.resolve(__dirname, 'src', 'index.js'),
	output: {
		path: path.resolve(__dirname, 'dist'),
		publicPath: '',
		filename: 'app.bundle.js'
	},
	module: {
		rules: [
			{
				test: /\.(png|jpg|svg)$/,
				loader: 'file-loader',
				options: {
					publicPath: '../',
					name: `images/[name].[ext]`
				}
			},
			{
				test: /\.(woff|ttf|eot|woff2)$/,
				loader: 'file-loader',
				options: {
					publicPath: '../',
					name: `fonts/[name].[ext]`
				}
			},
			{
				test: /\.(sa|sc|c)ss$/,
				use: [
					argv.mode === 'production' ? MiniCssExtractPlugin.loader : 'style-loader',
					'css-loader',
					'postcss-loader',
					'sass-loader'
				]
			}
		]
	},
	devServer: {
		static: {
			directory: path.join(__dirname, 'src')
		},
		compress: true,
		host: '0.0.0.0',
		port: 8080,
		hot: true
	},
	plugins: [
		new CleanWebpackPlugin(),
		new HtmlWebpackPlugin({
			title: 'rentgen',
			templateParameters: {
				demos: demos.map((d) => d.replace('.ejs', '.html'))
			},
			template: path.resolve(__dirname, 'src', 'index.ejs')
		}),
		new MiniCssExtractPlugin({
			filename: 'app.bundle.css'
		}),
		new CopyWebpackPlugin({
			patterns: [
				{
					from: path.resolve(__dirname, 'src', 'images'),
					to: path.resolve(__dirname, 'dist', 'images'),
					noErrorOnMissing: true
				},
				{
					from: path.resolve(__dirname, 'src', 'js'),
					to: path.resolve(__dirname, 'dist', 'js'),
					noErrorOnMissing: true
				},
				{
					from: path.resolve(__dirname, 'src', 'styles'),
					to: path.resolve(__dirname, 'dist', 'styles'),
					noErrorOnMissing: true
				}
			]
		})
	].concat(demosPlugins)
});


Ругается на последнюю строчку concat(demosPlugins).

"ValidationError: Invalid options object. HTML Loader has been initialized using an options object that does not match th e API schema.

- - options has an unknown property 'attrs[]'."
  • Вопрос задан
  • 75 просмотров
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Похожие вопросы