You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Framework agnostic, isomorphic <html>, <body and <head> rendering utility.
Installation
npm install set-page
Example
importPagefrom'set-page'// Create a new page element, this should be done once per request.constpage=newPage()page// Set html and body attributes..html({lang: 'en'}).body({class: 'loading'})// Add elements to <head> via method chaining..meta({charset: 'utf8'}).title('My App').base({href: '/admin/'}).meta({name: 'description'content: 'Cool stuff'}).link({rel: 'stylesheet',href: 'index.css'}).script({async: true,src: 'index.js'})
Overriding
set-page makes overriding values easy. If you invoke page again later it will replace any existing similar head element and merge any body or html attributes.
The module uses special keying scheme for head elements found in ./src/base.js under const KEYS to understand which elements to replace and which to add. Ultimately this allows for efficient re-ordering and rendering without any 'key' non-sense.
// Setting defaults somewhere (perhaps in a middleware or plugin.)page.title('My App').meta({name: 'author',content: 'Dylan Piercey'}).meta({name: 'description',content: 'Welcome to the site'}).link({rel: 'stylesheet',href: '/app.css'}).script({async: true,src: '/app.js'})// The later in a specific route you can continue chaining like so to override.page.title('My App > My sub page').meta({name: 'description',content: 'Sub page description'})
Browser Rendering
To render to the browser, simply invoke 'render' after all setting up the page.
page.render()
Server Rendering
Server side rendering is accomplished by invoking renderToString after setting up the page.
