npm

Ready to take your JavaScript development to the next level? Meet npm Enterprise - the ultimate in enterprise JavaScript.Learn more »

@phtml/self-closing

4.2.0 • Public • Published

pHTML Self Closing pHTML

NPM Version Build Status Support Chat

pHTML Self Closing lets you use self-closing tags in HTML.

<div><div class="main"/></div>
<template><slot name="title"/></template>
<custom-element/>
 
<!-- becomes -->
 
<div><div class="main"></div></div>
<template><slot name="title"></slot></template>
<custom-element></custom-element>

Note: The <script> and <style> tags are ignored.

Usage

Transform HTML files directly from the command line:

npx phtml source.html output.html -p @phtml/self-closing

Node

Add pHTML Self Closing to your project:

npm install @phtml/self-closing --save-dev

Use pHTML Self Closing to process your HTML:

const phtmlSelfClosing = require('@phtml/self-closing');
 
phtmlSelfClosing.process(YOUR_HTML /*, processOptions, pluginOptions */);

Or use it as a pHTML plugin:

const phtml = require('phtml');
const phtmlSelfClosing = require('@phtml/self-closing');
 
phtml([
  phtmlSelfClosing(/* pluginOptions */)
]).process(YOUR_HTML /*, processOptions */);

pHTML Self Closing runs in all Node environments, with special instructions for:

Node CLI Eleventy Gulp Grunt

Options

ignore

The ignore option defines self-closing elements that will not be expanded.

phtmlSelfClosing({ ignore: 'a' });
<a/>
<custom-element/>
<div/>
 
<!-- becomes -->
 
<a/>
<custom-element></custom-element>
<div></div>

The ignore option accepts a string or an array of strings.

phtmlSelfClosing({ ignore: ['a', 'custom-element'] });
<a/>
<custom-element/>
<div/>
 
<!-- becomes -->
 
<a/>
<custom-element/>
<div></div>

install

npm i @phtml/self-closing

Downloadsweekly downloads

6

version

4.2.0

license

CC0-1.0

homepage

github.com

repository

Gitgithub

last publish

collaborators

  • avatar
Report a vulnerability