From ba9caacaa588cca41af9a899bca8a1020f784f18 Mon Sep 17 00:00:00 2001
From: Johann-S <johann.servoire@gmail.com>
Date: Sun, 3 Mar 2019 12:01:29 +0200
Subject: add docs about how to use the esm version

---
 site/docs/4.3/getting-started/javascript.md | 20 ++++++++++++++++++++
 1 file changed, 20 insertions(+)

(limited to 'site/docs/4.3/getting-started/javascript.md')

diff --git a/site/docs/4.3/getting-started/javascript.md b/site/docs/4.3/getting-started/javascript.md
index 5659f6f93..bf9ebfe63 100644
--- a/site/docs/4.3/getting-started/javascript.md
+++ b/site/docs/4.3/getting-started/javascript.md
@@ -12,6 +12,26 @@ Plugins can be included individually (using Bootstrap's individual `js/dist/*.js
 
 If you use a bundler (Webpack, Rollup...), you can use `/js/dist/*.js` files which are UMD ready.
 
+## Using Bootstrap as a module
+
+We provide a version of Bootstrap built as `ESM` (`bootstrap.esm.js` and `bootstrap.esm.min.js`) which allows you to use Bootstrap as a module in your browser, if your [targeted browsers support it](https://caniuse.com/#feat=es6-module).
+
+{% highlight html %}
+<script type="module">
+  import { Toast } from 'bootstrap.esm.min.js'
+
+  Array.from(document.querySelectorAll('.toast'))
+    .forEach(toastNode => new Toast(toastNode))
+</script>
+{% endhighlight %}
+
+{% capture callout %}
+## Incompatible plugins
+
+Due to browser limitations, some of our plugins, namely Dropdown, Tooltip and Popover plugins, cannot be used in a `<script>` tag with `module` type because they depend on Popper.js. For more information about the issue see [here](https://developers.google.com/web/fundamentals/primers/modules#specifiers).
+{% endcapture %}
+{% include callout.html content=callout type="warning" %}
+
 ## Dependencies
 
 Some plugins and CSS components depend on other plugins. If you include plugins individually, make sure to check for these dependencies in the docs.
-- 
cgit v1.2.3