Exportieren Sie mehrere Klassen in ES6-Modulen

Ich versuche, ein Modul zu kreieren, dass die Exporte mehrere ES6-Klassen. Sagen wir, ich habe die folgende Verzeichnisstruktur:

my/
└── module/
    ├── Foo.js
    ├── Bar.js
    └── index.js

Foo.js und Bar.js jedem export eine Standard ES6-Klasse:

//Foo.js
export default class Foo {
  //class definition
}

//Bar.js
export default class Bar {
  //class definition
}

Ich habe momentan mein index.js wie folgt eingerichtet:

import Foo from './Foo';
import Bar from './Bar';

export default {
  Foo,
  Bar,
}

Aber ich bin nicht in der Lage, zu importieren. Ich möchte in der Lage sein, dies zu tun, aber die Klassen nicht gefunden werden:

import {Foo, Bar} from 'my/module';

Was ist die richtige Art und Weise zu exportieren, mehrere Klassen in einer ES6-Modul?

Kommentar zu dem Problem - Öffnen
verwenden Sie einfach die export, ohne die Standard - Kommentarautor: webdeb
Sie können nur ein default "exportieren". Stell dir vor, wenn jemand versucht, das zu tun "importieren" SomeClass "meine/Modul'. Dies würde automatisch importieren Sie die default - Modul von diesem Pfad. Wenn Sie hatte mehrere Standard-Exporte gibt, wie würden Sie wissen, was man importieren? Kommentarautor: saadq

InformationsquelleAutor der Frage cody | 2016-07-12

  1. 102

    Versuchen, diese in Ihrem code:

    import Foo from './Foo';
import Bar from './Bar';

export { //without default
  Foo,
  Bar,
}

    Btw, können Sie auch tun, es auf diese Weise:

    //bundle.js
export Foo from './Foo'
export Bar from './Bar'

//and import somewhere..
import { Foo, Bar } from './bundle'

    Mit export 

    export const MyFunction = () => {}
export const MyFunction2 = () => {}

const Var = 1;
const Var2 = 2;
export {
   Var, Var2
}


//Then import it this way
import {MyFunction, MyFunction2, Var, Var2 } from './foo-bar-baz';

    Den Unterschied zu export default

    ist, dass Sie exportiert werden können, etwas, und wenden Sie den Namen, wo Sie es importieren

    //export default
const Func = () {}
export default Func;

//import it
import Foo from './func'

    InformationsquelleAutor der Antwort webdeb

  2. 8

    Hoffe, das hilft:

    //Export (file name: my-functions.js)
export const MyFunction1 = () => {}
export const MyFunction2 = () => {}
export const MyFunction3 = () => {}

//Import
import * as myFns from "./my-functions";

myFns.MyFunction1();
myFns.MyFunction2();
myFns.MyFunction3();

    InformationsquelleAutor der Antwort Syed

  3. 1

    @webdeb die Antwort nicht für mich arbeiten, ich traf einen unexpected token Fehler beim kompilieren des ES6 mit Babel zu tun mit dem Namen default exportiert.

    Dieser arbeitete für mich, aber:

    //Foo.js
export default Foo
...

//bundle.js
export { default as Foo } from './Foo'
export { default as Bar } from './Bar'
...

//and import somewhere..
import { Foo, Bar } from './bundle'

    InformationsquelleAutor der Antwort inostia

  4. 0

    Export der Instanzen der Klassen können Sie diese syntax verwenden: 

    //export index.js
const Foo = require('./my/module/foo');
const Bar = require('./my/module/bar');

module.exports = {
    Foo : new Foo(),
    Bar : new Bar()
};

//import and run method
const {Foo,Bar} = require('module_name');
Foo.test();

    InformationsquelleAutor der Antwort Schmidko

Schreibe einen Kommentar