head-tags
v0.1.0
Published
manage document head like a pro
Downloads
4
Readme
head-tags
manage document head like a pro
Install
$ npm install --save head-tags
Usage
import headTags from 'head-tags'
const options = {
// we use this to get existing tags
identifyAttribute: 'head-manager'
}
const head = headTags({
title: 'foo',
titleTemplate(title) {
return `${title} - My Website`
},
style: [
{cssText: 'body {color: #666;}'}
],
link: [
{href: './main.css', rel: 'stylesheet'}
],
meta: [
{charset: 'utf-8'}
]
}, options)
// get the html string
head.title.toString() // <title>foo - My Website</title>
// reflect it in dom
head.title.mount() // document.title changed!
// reflect all tags in dom
head.mount()
// get string of all tags
head.toString()
// <title>...</title>
// <style head-manager>...</style>
// ...
API
Supported tags:
- title
- style
- link
- meta
- script
- noscript
title
title
is special, its value should be a string.
And we accept an optional titleTemplate
property to customize the output.
Tag Content
use cssText
property to set content of style
tag.
For other tags use innerHTML
to set content.
Attributes
All properties other than cssText
and innerHTML
will be attributes of the tag.
Set the value of property to undefined
to omit attribute value.
Contributing
- Fork it!
- Create your feature branch:
git checkout -b my-new-feature
- Commit your changes:
git commit -am 'Add some feature'
- Push to the branch:
git push origin my-new-feature
- Submit a pull request :D