0.1.3 • Published 6 years ago
posthtml-replace v0.1.3
PostHTML Plugin Boilerplate
Clone this repo and explain what your plugin do and why thousands of people need it ;)
Before:
<!doctype html>
<head>
<link rel="stylesheet" href="/assets/css/main.css">
<script src="/assets/js/main.js"></script>
</head>
<body>
<p>
<img src="/assets/images/main.png" alt="">
</p>
</body>
After:
<!doctype html>
<head>
<link rel="stylesheet" href="./assets/css/main.css">
<script src="./assets/js/main.js"></script>
</head>
<body>
<p>
<img src="./assets/images/main.png" alt="">
</p>
</body>
Install
Describe how big guys can install your plugin.
npm i posthtml-replace --save-dev
Usage
Plugin for html attribute replacing.
const fs = require('fs');
const posthtml = require('posthtml');
const posthtmlReplace = require('posthtml-replace');
posthtml()
.use(posthtmlReplace([
{
match: {
tag: 'link'
},
attrs: {
href: {
from: '/assets/css/',
to: './assets/css/'
}
}
},
{
match: {
tag: 'script'
},
attrs: {
src: {
from: '/assets/js/',
to: './assets/js/'
}
}
},
{
match: {
tag: 'img'
},
attrs: {
src: {
from: '/assets/images/',
to: './assets/images/'
}
}
}
], {} ))
.process(html/*, options */)
.then(result => fs.writeFileSync('./after.html', result.html));
Options
Describe all features of your plugin with examples of usage.
Feature
Before:
<html>
<body>
<p>OMG</p>
</body>
</html>
Add option:
const fs = require('fs');
const posthtml = require('posthtml');
const posthtmlPlugin = require('posthtml-plugin');
posthtml()
.use(posthtmlPlugin({ feature: 'wow' }))
.process(html/*, options */)
.then(result => fs.writeFileSync('./after.html', result.html));
After:
<html>
<body>
<p class="wow">OMG</p>
</body>
</html>
Contributing
See PostHTML Guidelines and contribution guide.