@plutojl/posthtml-crossorigin
v1.0.0
Published
PostHTML plugin description
Downloads
9
Readme
posthtml-crossorigin
Clone this repo and explain what your plugin do and why thousands of people need it ;)
Before:
<html>
<body>
<p class="wow">OMG</p>
</body>
</html>After:
<svg xmlns="http://www.w3.org/2000/svg">
<text class="wow" id="wow_id" fill="#4A83B4" fill-rule="evenodd" font-family="Verdana">
OMG
</text>
</svg>Install
Describe how big guys can install your plugin.
npm i posthtml-crossoriginUsage
Describe how people can use this plugin. Include info about build systems if it's necessary.
const fs = require('fs');
const posthtml = require('posthtml');
const posthtmlCrossorigin = require('posthtml-crossorigin');
posthtml()
.use(posthtmlCrossorigin({ /* options */ }))
.process(html/*, options */)
.then(result => fs.writeFileSync('./after.html', result.html));Options
You write a function value that computed the crossorigin attribute for each node in the HTML tree. See the example below.
Feature
Before:
<html>
<body>
<p>OMG</p>
<script src="asdf.js"></script>
<script src="https://mycdn.com/asdf.js"></script>
</body>
</html>Add option:
const fs = require('fs');
const posthtml = require('posthtml');
const posthtmlCrossorigin = require('posthtml-crossorigin');
posthtml()
.use(posthtmlCrossorigin({
value: (src, current_crossorigin_value, node) => {
// Compute a new crossorigin value here, and return it.
if(src.includes("https://mycdn.com")) {
return "anonymous"
} else {
// If you do not want to change the attribute, return current_crossorigin_value
return current_crossorigin_value
}
}
}))
.process(html/*, options */)
.then(result => fs.writeFileSync('./after.html', result.html));After:
<html>
<body>
<p class="wow">OMG</p>
<script src="asdf.js"></script>
<script src="https://mycdn.com/asdf.js" crossorigin="anonymous"></script>
</body>
</html>Contributing
See PostHTML Guidelines and contribution guide.