From 93acc734d893f18b03ab451136216aa86f5f9982 Mon Sep 17 00:00:00 2001 From: Caspar MacRae Date: Mon, 14 Mar 2022 19:49:36 +0000 Subject: [PATCH] Docs: dependencies mgmt for vanilla ESM in browser Doc change for https://github.com/twbs/bootstrap/issues/31944 --- .../docs/5.2/getting-started/javascript.md | 38 ++++++++++++++++++- 1 file changed, 36 insertions(+), 2 deletions(-) diff --git a/site/content/docs/5.2/getting-started/javascript.md b/site/content/docs/5.2/getting-started/javascript.md index fd676cf42344..8768b9a4a8b3 100644 --- a/site/content/docs/5.2/getting-started/javascript.md +++ b/site/content/docs/5.2/getting-started/javascript.md @@ -36,9 +36,43 @@ We provide a version of Bootstrap built as `ESM` (`bootstrap.esm.js` and `bootst ``` {{< callout warning >}} -## Incompatible plugins +## Dependencies for vanilla ESM in the browser requires an `importmap` + +In order to support build tools, NPM dependencies, etc - external dependencies such as PopperJs are `import`ed with their NPM package name (e.g. `@popperjs/core`), to make this work in the browser you need to define an `importmap` which resolves arbitrary names to fully-qualified or relative URIs. + +If your [targeted browsers](https://caniuse.com/?search=importmap) do not support `importmap` then you will need to use the [es-module-shims](https://github.com/guybedford/es-module-shims) library. For example: + +```html + + + + + + + Hello, modularity! + + +

Hello, modularity!

+ + + + + + + +``` -Due to browser limitations, some of our plugins, namely Dropdown, Tooltip and Popover plugins, cannot be used in a `