# dompiler
> Dompiler is a tiny framework that helps with HTML templating with plain JavaScript.
Latest version **1.1.0** (published 2019-06-30) · MIT license · 0 weekly downloads
## Install
```sh
npm install dompiler
pnpm add dompiler
yarn add dompiler
bun add dompiler
```
## Health
**Score 15/100 (F)** — status: abandoned.
Positive: no vulnerabilities.
Warnings: low downloads; no types; no esm support.
Negative: abandoned; low maintenance score.
## Facts
| | |
|---|---|
| Version | 1.1.0 |
| Published | 2019-06-30 |
| First published | 2019-06-30 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | none |
| Module format | CommonJS |
| Dependencies | 0 |
| Unpacked size | 32.9 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| GitHub stars | 4 |
| Author | Nicholas Westby |
| Maintainers | minify.org |
| Keywords | javascript, html, templating |
## Links
- npm: https://www.npmjs.com/package/dompiler
- Repository: https://github.com/Nicholas-Westby/dompiler
- Homepage: https://www.dompiler.com/
- Issues: https://github.com/Nicholas-Westby/dompiler/issues
- npm.io page: https://npm.io/package/dompiler
## Alternatives
- [@tsparticles/shape-image](https://npm.io/package/@tsparticles/shape-image.md) — 303.7K weekly downloads
- [@tsparticles/shape-line](https://npm.io/package/@tsparticles/shape-line.md) — 233.7K weekly downloads
- [stringify-attributes](https://npm.io/package/stringify-attributes.md) — 58.6K weekly downloads
- [mobile-drag-drop](https://npm.io/package/mobile-drag-drop.md) — 46.3K weekly downloads
- [@comunica/actor-rdf-parse-html](https://npm.io/package/@comunica/actor-rdf-parse-html.md) — 29.2K weekly downloads
## Recent versions
- 1.1.0 (latest) — 2019-06-30
- 1.0.3 — 2019-06-30
- 1.0.2 — 2019-06-30
- 1.0.1 — 2019-06-30
- 1.0.0 — 2019-06-30
## README
# Overview
Dompiler is a tiny JavaScript library that facilitates HTML templating.
You can use it with Node/NPM or directly in the browser without compilation. Both approaches are explained below (see "NPM Usage" and "Browser Module Usage").
# NPM Usage
To install Dompiler, run the following command from your terminal:
```
npm i dompiler --save-dev
```
That will install it into your `node_modules` folder.
Next, you'll need to create a JavaScript file and reference Dompiler:
```javascript
let Dompiler = require("dompiler").Dompiler,
Events = require("dompiler").Events;
```
Now you can use Dompiler as you like.
As an example, you might create an HTML file like this:
```html
Dompiler Example
```
Then you'd have a JavaScript file that looks like this:
```javascript
let Dompiler = require("dompiler").Dompiler,
Events = require("dompiler").Events;
// Initialize Dompiler.
let {
compile
} = new Dompiler().withBinding();
// Variables.
let message = "Hello World.",
date = new Date().toLocaleDateString();
// Compile markup string into a document fragment.
let markup = `
${message} The date is ${date}.
`,
compiled = compile(markup);
// Append compiled markup to container.
let container = document.querySelector(".example-container");
container.appendChild(compiled);
```
Then you'd run browserify to create the `app.min.js` file from that one.
And that's it. You should be able to view your HTML file in the browser.
# Browser Module Usage
You don't need Node/NPM to use Dompiler. You can just use it directly in the browser.
To read about that, got to [dompiler.com](https://www.dompiler.com/).
The short version is that you use `type="module"` when including your script, and you use an import statement rather than a require statement:
```javascript
import Dompiler from "./some-path/dompiler.js";
import Events from "./some-path/events.js";
```
And that does not require you to use Browserify.
# Building Dompiler Source (Uncommon)
This section is only if you're a developer contributing to Dompiler in the Dompiler repository.
To build, run the following in the command line from the /src/ folder:
```
npm i
npm run build
```
This will run the build.js file, which will do the following:
* Transform the JavaScript files to create versions that work with Node/NPM.
* Copy the original JavaScript files into the /docs/ folder (so they can be used by the examples and tutorial).
---
_Source: https://npm.io/package/dompiler · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._