diff --git a/.gitignore b/.gitignore index 878275d..9daa824 100644 --- a/.gitignore +++ b/.gitignore @@ -1,2 +1,2 @@ .DS_Store -bower_components +node_modules diff --git a/README.md b/README.md index 669152a..fa907ec 100644 --- a/README.md +++ b/README.md @@ -9,10 +9,33 @@ See the [HTML spec](https://html.spec.whatwg.org/multipage/forms.html#the-dialog ### Installation -You may optionally install via NPM or Bower- +You may optionally install via NPM - $ npm install dialog-polyfill - $ bower install dialog-polyfill + + +There are several ways that to include the dialog polyfill: + +* include `dialog-polyfill.js` script directly in your HTML, which exposes a global `dialogPolyfill` function. +* `import` (es modules) +* `require` (commonjs/node) + + +```javascript +// direct import (script module, deno) +import dialogPolyfill from './node_modules/dialog-polyfill/index.js'; + +// *OR* + +// modern es modules with rollup/webpack bundlers, and node via esm module +import dialogPolyfill from 'dialog-polyfill' + +// *OR* + +// traditional commonjs/node and browserify bundler +const dialogPolyfill = require('dialog-polyfill') +``` + ### Supports @@ -25,11 +48,11 @@ This polyfill works on modern versions of all major browsers. It also supports I 3. Register the elements using `dialogPolyfill.registerDialog()`, passing it one node at a time. This polyfill won't replace native support. 4. Use your `` elements! -## Example +## Script Global Example ```html - + @@ -38,7 +61,7 @@ This polyfill works on modern versions of all major browsers. It also supports I - + - - - + + + + + - + +