ES6 Exportieren und Importieren einer Funktion

Question

Wenn ich eine ES6 JS-Datei (test.js) haben ...

export default function() { 
    let foo = "test" 
    return foo 
} 

Mit Babel, ist es möglich, transpile und sie in einer Datei index.html nennen

<script src="js/text-min.js"></script> 

Und anfangen, die Funktion zu verwenden, ohne sie in eine andere js-Datei importieren zu müssen? Für Ex. Das nächste Skript-Tag nach hätte den folgenden Code. Dies ist im Einsatz mit Webpack -

<script> 
    var bar = new foo(); 
    console.log(bar); 
</script> 

Answer 1

Okay, also habe ich dieses Problem gelöst, indem ich eine Ausgabe-Variable mit Webpack zur Verfügung gestellt habe. Großer Artikel, der dazu spricht - http://siawyoung.com/coding/javascript/exporting-es6-modules-as-single-scripts-with-webpack.html

Answer 2

Die transpiled Version des obigen Code wie folgt erzeugt,

"use strict"; 

    Object.defineProperty(exports, "__esModule", { 
    value: true 
    }); 

    exports.default = function() { 
    var foo = "test"; 
    return foo; 
    }; 

Wie Sie sehen können, ist es eine Eigenschaft hinzufügen Objekt mit dem Namen __esModule zu exportieren. Nichts anderes. Sie haben also keine Möglichkeit, diese Standardfunktion einzuschließen, ohne Import oder Require zu verwenden.

Answer 3

Was Sie eigentlich suchen, ist eine globale Variable (was wahrscheinlich keine gute Idee ist). Zum Beispiel:

Modul 1:

import {foo} from 'foo'; // still an ES6 module, just no export 

// global variable 'bar' 
window.bar = (...args) => foo(...args) + 6; 

Dann in Modul 2:

bar(1, 3, 5); 

Beachten Sie, dass dies den gesamten Sinn der Verwendung von Modulen besiegt und soll sehr sparsam eingesetzt werden.