How to access variables in Javascript files using babel?

Question

I am trying to port my code from ES5to ES6and use babel. I use the module template quite a bit in my code, so if I have a module like apple, I will do something like this:

var appleModule = (function() {
    var yummy = true;
    var eat = function() { }

    return { "eat": eat }
})();

and then log in appleModuleto another file. However, moving all of this:

<script type="text/javascript" src="/scripts/apple.js"></script>
<script type="text/javascript" src="/scripts/banana.js"></script>

:

<script src="https://cdnjs.cloudflare.com/ajax/libs/babel-core/5.8.25/browser.js"></script>
<script type="text/babel" src="/scripts/apple.js"></script>
<script type="text/babel" src="/scripts/banana.js"></script>

I can no longer access appleModulein different files. I get ReferenceErrorby saying that it does not exist. How to access variables in files using babel and ES6?

Answer 1

, babel-browser

, , , . . .

Babel . , .

, .

,

a.js

var yummy = true;
var eat = function(){};

export var eat;

b.js

import {eat} from './a.js';

Answer 2

ES6 , , , appleModule

export var appleModule = (function() {
var yummy = true;
var eat = function() { }

return { "eat": eat }
})();

import  {appleModule as appleModule}  from './apple';