posthtml-noscript

[![NPM][npm]][npm-url]
[![Deps][deps]][deps-url]
[![Build][build]][build-badge]
[![Coverage][codecov-shield]][codecov]

posthtml-noscript is a PostHTML plugin to insert noscript content.

Use Cases:

- Display a "Enable JavaScript" message in a Single Page Application (SPA)
- Specify resource link elements (e.g. stylesheets) to load if JavaScript is disabled

---

Before:

``html





`

After:

`html






`

Install

`bash
yarn add -D posthtml-noscript


OR


npm i posthtml-noscript
`

Usage

`js
const fs = require('fs');
const posthtml = require('posthtml');
const { noscript } = require('posthtml-noscript');

const html = fs.readFileSync('./index.html');

posthtml()
.use(noscript({ content: 'You need to enable JavaScript to run this app.' }))
.process(html)
.then(result => fs.writeFileSync('./after.html', result.html));
`

Options

By default, the plugin prepends noscript markup inside the body tag.

Optionally, specify "head" as the parent tag to insert noscript content inside the head tag.

Before:

In this example, custom fonts are loaded via Adobe Typekit using JavaScript. Without a resource link fallback, custom fonts can't be loaded.

`html



`

Config:

`js
const fs = require('fs');
const posthtml = require('posthtml');
const { noscript } = require('posthtml-noscript');

const html = fs.readFileSync('./index.html');

posthtml()
.use(
noscript({
content: '',
parent: 'head'
})
)
.process(html)
.then(result => fs.writeFileSync('./after.html', result.html));
`

After:

If JavaScript is disabled, custom fonts can still be loaded.

`html




``

Contributing

See the PostHTML Guidelines.

Changelog

License

MIT

[npm]: https://img.shields.io/npm/v/posthtml-noscript.svg?color=blue
[npm-url]: https://npmjs.com/package/posthtml-noscript
[deps]: https://david-dm.org/metonym/posthtml-noscript.svg
[deps-url]: https://david-dm.org/metonym/posthtml-noscript
[build]: https://travis-ci.com/metonym/posthtml-noscript.svg?branch=master
[build-badge]: https://travis-ci.com/metonym/posthtml-noscript
[codecov]: https://codecov.io/gh/metonym/posthtml-noscript
[codecov-shield]: https://img.shields.io/codecov/c/github/metonym/posthtml-noscript.svg