html-includes
Compile your html into a destination folder with partial includes
Last updated 4 months ago by entozoon .
MIT · Repository · Bugs · Original npm · Tarball · package.json
$ cnpm install html-includes 
SYNC missed versions from official npm registry.

HTML Includes

Commandline HTML compilation with partial includes. Useful for super quick templating, or perhaps bundling things into an iframe.

"Aren't there a million of these?"

Yes. However, they all miss at least one of the following requirements:

  • No webpack necessary
  • Glob folder support
  • Watch
  • Relative paths
  • Minification
  • Saving compiled files with ignoreable filenames
  • Passing parameters to includes, like props to a component

Install

npm i --save-dev html-includes

Add the script into your package.json along the lines of:

"scripts": {
  "compile": "html-includes --src src --dest dist",
  "compile:min": "html-includes --src src --dest dist --minify"
},

See options below for more options.

Run

npm run compile

Use

There is an example project to look at but put simply, here is how you'd use the script parameters above:

src/index.html

<html>
  <head>
    ${require('./_meta.html')}
  </head>
  <body>
    <main>
      ${require('./_main.html') foo="and you can also pass props"}
    </main>
  </body>
</html>

src/_meta.html

<meta meta="meta" />

src/_main.html

<p>Main content ${props.foo}</p>

Result

In /dist you'd have simply index.html, containing:

<html>
  <head>
    <meta meta="meta" />
  </head>
  <body>
    <main>
      <p>Main content and you can also pass props</p>
    </main>
  </body>
</html>

Or with the --minify flag, you'd get:

<html>
  <head>
    <meta meta="meta" />
  </head>
  <body>
    <main><p>Main content</p></main>
  </body>
</html>

Options

Flag Description Default
--watch Watch for file changes false
--minify Enable Minification of HTML false
--minify option=[boolean] Set any of the boolean options in https://github.com/kangax/html-minifier#options-quick-reference - for example --minify conservativeCollapse=true Various typical values
--quiet Silence successful save logs false

Notes

  • Filenames starting with an _ underscore will not be saved into destination (in the style of partial files in Sass).

Current Tags

  • 4.3.3                                ...           latest (4 months ago)

26 Versions

  • 4.3.3                                ...           4 months ago
  • 4.3.2                                ...           5 months ago
  • 4.3.1                                ...           5 months ago
  • 4.3.0                                ...           5 months ago
  • 4.2.1                                ...           5 months ago
  • 4.2.0                                ...           a year ago
  • 4.1.2                                ...           a year ago
  • 4.1.1                                ...           2 years ago
  • 4.1.0                                ...           2 years ago
  • 4.0.1                                ...           2 years ago
  • 4.0.0                                ...           2 years ago
  • 3.1.0                                ...           2 years ago
  • 3.0.0                                ...           2 years ago
  • 2.1.0                                ...           3 years ago
  • 2.0.1                                ...           3 years ago
  • 2.0.0                                ...           3 years ago
  • 1.2.3                                ...           3 years ago
  • 1.2.2                                ...           3 years ago
  • 1.2.1                                ...           3 years ago
  • 1.2.0                                ...           3 years ago
  • 1.1.2                                ...           3 years ago
  • 1.1.1                                ...           3 years ago
  • 1.1.0                                ...           3 years ago
  • 1.0.2                                ...           3 years ago
  • 1.0.1                                ...           3 years ago
  • 1.0.0                                ...           3 years ago
Maintainers (1)
Downloads
Today 0
This Week 2
This Month 3
Last Day 0
Last Week 1
Last Month 1
Dependencies (8)
Dev Dependencies (0)
None
Dependents (0)
None

Copyright 2014 - 2017 © taobao.org |