rehype-javascript-to-bottom

rehype plugin to move JavaScript `<script>` to `<body>`

Downloads in past

Stats

StarsIssuesVersionUpdatedCreatedSize
rehype-javascript-to-bottom
3.0.0a year ago6 years agoMinified + gzip package size for rehype-javascript-to-bottom in KB

Readme

rehype-javascript-to-bottom
!Buildbuild-badgebuild !Coveragecoverage-badgecoverage !Downloadsdownloads-badgedownloads !Sizesize-badgesize !Sponsorssponsors-badgecollective !Backersbackers-badgecollective !Chatchat-badgechat
Move JS <script> elements to the end of <body>.
This can decrease the time to first render.
You can pass filter, a function called with each checked node, returning true if the script should be moved, and false if not.

Install

This package is ESM onlyesm: Node 12+ is needed to use it and it must be importeded instead of requiredd.
npm install rehype-javascript-to-bottom
This package exports no identifiers.
The default export is `rehypeJavaScriptToBottom`

## Use

On the API:

```diff
 import {unified} from 'unified'
 import rehypeParse from 'rehype-parse'
+import rehypeJavaScriptToBottom from 'rehype-javascript-to-bottom'
 import rehypeStringify from 'rehype-stringify'

 unified()
   .use(rehypeParse)
+  .use(rehypeJavaScriptToBottom)
   .use(rehypeStringify)
   .process('<span>some html</span>', function (err, file) {
     console.error(report(err || file))
     console.log(String(file))
   })

On the CLI:
rehype input.html --use javascript-to-bottom --output output.html

Example

In
<!doctype html><html><head><script src="index.js"></script></head><body></body></html>
Out
<!doctype html><html><head></head><body><script src="index.js"></script></body></html>

Contribute

See contributing.mdcontributing in rehypejs/.githubhealth for ways to get started. See support.mdsupport for ways to get help.
This project has a code of conductcoc. By interacting with this repository, organization, or community you agree to abide by its terms.

License

MITlicense © Titus Wormerauthor