question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

support native es6 module loading

See original GitHub issue

Bootstrap 4.3 (budnle from dist folder) fails when global is null.

From sources:

(function (global, factory) {
  typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('jquery'), require('popper.js')) :
  typeof define === 'function' && define.amd ? define(['exports', 'jquery', 'popper.js'], factory) :
  (factory((global.bootstrap = {}),global.jQuery,global.Popper));
}(this, (function (exports,$,Popper) {...});

There this from next line can’t be null since we will get an excpetion on global.bootstrap = {}

And there are situations when this can be null during loading e.g. importing using native module support:

<script type="module">
           import Popper from "./js/popper.js"; // esm version
           window.Popper = Popper;
           import "./js/bootstrap.js"; // TODO : error
           // expected : window.bootstrap created , plugins attached to jquery etc.
</script>

Check sources of jquery. They support this new type of loading by checking (this==null)?window:this.

Issue Analytics

  • State:closed
  • Created 5 years ago
  • Comments:5 (3 by maintainers)

github_iconTop GitHub Comments

3reactions
Johann-Scommented, Jan 3, 2019

About that we should ship an ESM version of Bootstrap

1reaction
Johann-Scommented, May 27, 2019

Hi @KayakinKoder absolutly not, Rollup or Webpack prefer ESM build but if there is no ESM build they use the UMD one (for Bootstrap) 😉

BTW this issue is solved by: https://github.com/twbs/bootstrap/pull/28386

And will be in our v5

Read more comments on GitHub >

github_iconTop Results From Across the Web

Support native ES6 module loading #31944 - twbs/bootstrap
The problem is that popper (even though it supports es modules) is not able to be resolved by the browser. The spec currently...
Read more >
JavaScript modules - MDN Web Docs
This guide gives you all you need to get started with JavaScript module syntax.
Read more >
JavaScript modules via script tag | Can I use... Support tables ...
Loading JavaScript module scripts (aka ES6 modules) using <script type="module"> Includes support for the nomodule attribute. Usage % of. all users, all tracked ......
Read more >
Native ES6 Module Browser Support Is Here!
In order to get ES6 working, we first need to set au a build system such as Webpack, Gulp, or Browserify- which will...
Read more >
Using Native, Unbundled ES6 Modules With a Simple Build ...
So how does ES6 module loading work in the browser? ... ES6 and import are supported across all browsers (except for IE, obviously...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found