posthtml-plugin-remove-duplicates

PostHTML plugin removes duplicated elements

Usage no npm install needed!

<script type="module">
  import posthtmlPluginRemoveDuplicates from 'https://cdn.skypack.dev/posthtml-plugin-remove-duplicates';
</script>

README

PostHTML Plugin Remove Duplicates

This plugin removes duplicated tags. It can be used to remove duplicated css and script tags when your markup is assembling code from different sources.

Before:

<html>
  <body>
    <link rel="stylesheet" type="text/css" href="component.css">
    <div>... component...</div>
    <link rel="stylesheet" type="text/css" href="component.css">
    <div>... component...</div>
  </body>
</html>

After:

<html>
  <body>
    <link rel="stylesheet" type="text/css" href="component.css">
    <div>... component...</div>
    <div>... component...</div>
  </body>
</html>

Install

npm i posthtml posthtml-plugin-remove-duplicates

Usage

const fs = require('fs');
const posthtml = require('posthtml');
const posthtmlPluginRemoveDuplicates = require('posthtml-plugin-remove-duplicates');

posthtml()
    .use(posthtmlPluginRemoveDuplicates({ css: true, js: true }))
    .process(html)
    .then(result => fs.writeFileSync('./after.html', result.html));

Options

  • css: remove duplicated css tags (default false)
  • js: remove duplicated script tags (default false)
  • custom: object or array of objects, with tag (optional) and attribute (mandatory) { tag: 'div', attr: 'data-remove-dup' }