html-merge-cmd

1.0.0 • Public • Published

HTML Merge

This package provides a command-line tool for minimal static sites, using HTML Merge.

Updates are done in-place - there is no second output directory.

The specification aims to be so simple that you could implement this easily yourself, if you have access to an HTML parser and basic CSS selectors.

Usage

If you have a directory organised like this:

index.html
contact.html
blog/index.html
blog/post-01.html

Running html-merge on/in this directory will merge each page into its parent page, in-place. HTML files without the appropriate merge-attributes are left untouched.

Install

This should be installed globally:

npm install -g html-merge

And used like this, with an optional target directory:

html-merge <dir>

Attributes

You annotate elements using the merge-replace attribute, which contains a CSS selector:

<title merge-replace="head title">New Title!</title>
<div id="main" merge-replace="#main">New body!</div>

The tool takes the closest parent (index.html):

<!DOCTYPE html>
<html>
    <head>
        <title>Old title</title>
    </head>
    <body>
        <div id="nav">(common content)</div>
        <div id="main">Old body</div>
    </body>
</html>

And merges your changes into it (in-place):

<!DOCTYPE html>
<html>
    <head>
        <title merge-replace="head title">New Title!</title>
    </head>
    <body>
        <div id="nav">(common content)</div>
        <div id="main" merge-replace="#main">New body!</div>
    </body>
</html>

Since everything without merge-replace= is ignored, this is equivalent to our original input.

Package Sidebar

Install

npm i html-merge-cmd

Weekly Downloads

0

Version

1.0.0

License

ISC

Unpacked Size

38.8 kB

Total Files

16

Last publish

Collaborators

  • geraintluff