@sumotto/beautify-html-webpack-plugin v1.0.0

HTML Beautifier plugin for Webpack

Webpack plugin for beautify HTML files (created using HTML Webpack Plugin) using JS Beautifier.

Installation

The plugin requires your application to be installed Webpack 4 or 5, and HTML Webpack Plugin 4 or 5.

You can install the package as follows:

npm install @sumotto/beautify-html-webpack-plugin --save-dev

# or

yarn add @sumotto/beautify-html-webpack-plugin --dev

Usage

Require the plugin in your Webpack config:

const BeautifyHtmlWebpackPlugin = require( '@sumotto/beautify-html-webpack-plugin' );

// or

import BeautifyHtmlWebpackPlugin from '@sumotto/beautify-html-webpack-plugin';

Add the plugin to your webpack configuration's plugins array after Html Webpack Plugin:

plugins: [
	new HtmlWebpackPlugin(),
	new BeautifyHtmlWebpackPlugin(),
]

Configure the parameters you need by passing the settings object for JS Beautifier. By default, the plugin uses default settings from JS Beautifier:

plugins: [
	new HtmlWebpackPlugin(),
	new BeautifyHtmlWebpackPlugin( {
		"indent_size": 4,
		"indent_char": " ",
		"indent_level": 0,
		"indent_with_tabs": false,
		"preserve_newlines": true,
		"max_preserve_newlines": 10,
		"jslint_happy": false,
		"space_after_named_function": false,
		"space_after_anon_function": false,
		"brace_style": "collapse",
		"keep_array_indentation": false,
		"keep_function_indentation": false,
		"space_before_conditional": true,
		"break_chained_methods": false,
		"eval_code": false,
		"unescape_strings": false,
		"wrap_line_length": 0,
		"indent_empty_lines": false,
		"templating": [ "auto" ]
	} ),
]

Notes

The plugin inside is trying to require HTML WebPack Plugin from your dependencies require( 'html-webpack-plugin' ), if for some reason you connect it from another location, you can transfer it to the second parameter:

plugins: [
	new HtmlWebpackPlugin(),
	new BeautifyHtmlWebpackPlugin( {}, HtmlWebpackPlugin ),
]

License

MIT License