JavaScript Polyfill utility

This polyfills older browsers JS with things commonly needed in Visual Framework JavaScript (support for promises is a common need), this is also a general utility template to provide polyfill JS when most commonly needed.

github location npm version

Usage

This components attempts to gracefully serve the JS to only the browsers that need it by using the nomodule attribute in script tags; as MDN web docs puts it: "in effect, this can be used to serve fallback scripts to older browsers that do not support modular JavaScript code".

We use polyfill bundling from Polyfill.io.

This is is what it looks like:

<script nomodule src="https://polyfill.io/v3/polyfill.min.js?features=default"></script>

In effect, this provides better support to Internet Explorer and very old versions of Chrome, FireFox and Safari.

Future plans

In the future we may support passing parameters to the NJK template to load various mixes of polyfills.

Variants

HTML
<script nomodule crossorigin="anonymous" src="https://polyfill.io/v3/polyfill.min.js?flags=gated&features=default"></script>
              

Examples

Installation info

This repository is distributed with npm. After installing npm, you can install vf-polyfill-js with this command.

$ yarn add --dev @visual-framework/vf-polyfill-js

Sass/CSS

The style files included are written in Sass. If you're using a VF-core project, you can import it like this:

@import "@visual-framework/vf-polyfill-js/index.scss";

Make sure you import Sass requirements along with the modules. You can use a project boilerplate or the vf-sass-starter

Changelog

Changelog

1.0.0-alpha.1

  • Initial release

Assets



File system location: components/vf-polyfill-js

Find an issue on this page? Propose a change or discuss it.