Import/Export kann nicht in Browser funktioniert durch babel.js

Question

ich hinzufügen babel Compiler in meiner Seite mit ES6 Syntax verwenden, indem Sie unter:

<script src="babel.min.js"></script> 

Und ein einfaches Modul in M.js erstellen wie folgt:

export var M={ 
    p:3 
}; 

Und es in meiner Webseite:

<script type="text/babel"> 
    import {M} from './M'; 
    console.log(M.p); 
</script> 

Aber unter Fehlern in der Konsole erfüllen:

Uncaught ReferenceError: require is not defined 

Wie kann ich Modul funktioniert im Browser? Unterstützt babel.js das Modul oder nicht? Wenn nicht, kann ich die ES6-Modul-Syntax im Browser anders gestalten.

Answer 1

Verwenden Sie einen dynamischen ES-Modul-Loader wie SystemJS und die Babel Plugin

Answer 2

Haben Sie versucht, das Daten-Plug-Attribut auf "Transform-es2015-Module-umd"? Wie nachstehend?

<script data-plugins="transform-es2015-modules-umd" type="text/babel"> 
    import M from './M'; 
    console.log(M.p); 
</script>