How to use plugins modules exports and imports? #60

stefek99 · 2016-09-21T09:38:25Z

https://developer.mozilla.org/en/docs/web/javascript/reference/statements/export

I have following code:

<!doctype html>
<html>
<head>
    <title>Babel Test</title>
</head>
<body>

    <script src="https://cdnjs.cloudflare.com/ajax/libs/babel-standalone/6.14.0/babel.min.js"></script>

     <script data-plugins="transform-es2015-modules-umd" type="text/babel">
        export default function cube(x) {
          return x * x * x;
        }   
    </script>

</body>
</html>

I can export function cube but how do I import it?

Note that data-plugins="transform-es2015-modules-umd" is required, otherwise it will throw ReferenceError: exports is not defined

The text was updated successfully, but these errors were encountered:

Daniel15 · 2016-10-10T20:15:29Z

I'm not sure how ES6 modules would work within the context of a browser - How would you define the module name, for example?

stefek99 · 2016-10-12T21:11:01Z

I'm sorry, not an expert here, and I know my case was pretty edgy...

I think I wanted to edit source file of some library and have it loaded directly into browser as I was working on limited environment (no admin rights, cannot install anything)

marcioacmauricio · 2016-10-22T14:16:55Z

I also need to use exports defaults in my work completion university course, if you can find a solution I will be grateful if you share

ChrisCinelli · 2016-10-27T23:01:57Z

I think if you have a jsFiddle, I may want to import external files. For example from rawgit.com

marcioacmauricio · 2016-10-28T12:03:21Z

https://jsfiddle.net/marcioacmauricio/o142f0d1/2/

brownieboy · 2017-02-13T00:56:03Z

Native module loading is coming to browsers. In fact, it's already available in Firefox, Safari and Edge, but only in pre-release versions, and then hidden behind a flag. Here's a very good blog post that gives an overview of the current state of play:
https://blog.hospodarets.com/native-ecmascript-modules-the-first-overview

I tested native module loading, using version 54 of the Firefox Nightly build with the dom.moduleScripts.enabled boolean flag set to true. This is bleeding edge stuff to be sure, but I can confirm that it does work!

It would be great if babel-standalone could somehow work together with native module loading to transpile React, for example.

How would one integrate the two though? One stumbling block is that native module loading requires that the initial script is loaded as<script type="module", whereas babel-standalone requires <script type="text/babel" .

See also issue #71

chobo2 · 2017-05-16T21:05:19Z

What is the solution to get this to work?

jeffrafter · 2017-09-09T13:21:12Z

test.html:

<!doctype html>
<html>
<head>
  <title>Babel Test</title>
</head>
<body>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/babel-standalone/6.14.0/babel.min.js"></script>
  <script data-plugins="transform-es2015-modules-umd" type="text/babel" src="./cube.js"></script>
  <script data-plugins="transform-es2015-modules-umd" type="text/babel">
    import cube from 'cube'
    console.log(cube(3))
  </script>
</body>
</html>

cube.js

export default function cube(x) {
  return x * x * x;
}

ryanpcmcquen · 2017-12-05T20:32:02Z

Is there a solution for this? Should we move this to the main Babel repo for more exposure (now that standalone has moved)?

Daniel15 · 2017-12-05T20:33:09Z

I think babel/babel#6223 should actually fix this.

If that PR doesn't fix it, let's open a new issue in the Babel repo 😃

jeffrafter mentioned this issue Sep 9, 2017

Allow users to specify a module for inline scripts #92

Closed

Daniel15 closed this as completed Dec 5, 2017

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

How to use plugins modules exports and imports? #60

How to use plugins modules exports and imports? #60

stefek99 commented Sep 21, 2016

Daniel15 commented Oct 10, 2016

stefek99 commented Oct 12, 2016

marcioacmauricio commented Oct 22, 2016

ChrisCinelli commented Oct 27, 2016

marcioacmauricio commented Oct 28, 2016

brownieboy commented Feb 13, 2017 •

edited

Loading

chobo2 commented May 16, 2017

jeffrafter commented Sep 9, 2017

ryanpcmcquen commented Dec 5, 2017

Daniel15 commented Dec 5, 2017 •

edited

Loading

How to use plugins modules exports and imports? #60

How to use plugins modules exports and imports? #60

Comments

stefek99 commented Sep 21, 2016

Daniel15 commented Oct 10, 2016

stefek99 commented Oct 12, 2016

marcioacmauricio commented Oct 22, 2016

ChrisCinelli commented Oct 27, 2016

marcioacmauricio commented Oct 28, 2016

brownieboy commented Feb 13, 2017 • edited Loading

chobo2 commented May 16, 2017

jeffrafter commented Sep 9, 2017

ryanpcmcquen commented Dec 5, 2017

Daniel15 commented Dec 5, 2017 • edited Loading

brownieboy commented Feb 13, 2017 •

edited

Loading

Daniel15 commented Dec 5, 2017 •

edited

Loading