it-swarm.com.de

Wie exportiere ich ein importiertes Objekt in ES6?

Der Anwendungsfall ist einfach: Ich möchte nur ein Objekt mit dem Namen so exportieren, wie es importiert wurde.

zum Beispiel:

import React from 'react';
export React;

aber das geht nicht. Ich muss schreiben:

import React from 'react';
export const React = React;

Aber das ist seltsam. Was ist der richtige Weg, dies zu tun?

AKTUALISIERTE:

Danke für Hilfe und Hinweise. Ich habe mein Problem mit vielen Hinweisen gelöst. Ich möchte einige häufige Fälle für mich und die Lösungen mitteilen.

export einfuhren

import d, {obj} from '...';

export {obj, d};
export {obj as name1, d as name2};

exportieren Sie alle genannten Importe erneut

export * from '...';
export * as name1 from '...';

einige benannte Importe wieder exportieren

export {a, b as name1} from '...';

exportieren Sie den Standardimport als Standardexport erneut

export {default} from '...';

exportieren Sie den Standardimport als benannten Export erneut

export {default as name1} from '...';
146
Yao Zhao

Ich mache häufig die folgenden Dateien in index.js-Dateien, die aus mehreren Dateien bestehen:

export {default as SomeClass} from './SomeClass';
export {someFunction} from './utils';
export {default as React} from 'react';

Dieser blog-Eintrag enthält einige zusätzliche Beispiele.

Wichtige Notiz

Sie sollten diese eslint-rule beachten, wenn Sie auf diese exportierten Importe zugreifen. Grundsätzlich sollten Sie in einer anderen Datei nicht:

import SomeClassModule from 'SomeClass/index.js';
SomeClassModule.someFunction(); // Oops, error

Du solltest das tun:

import SomeClassModule, {someFunction} from 'SomeClass/index.js';
someFunction(); // Ok
76
Eric H.

Sie können importierte Dateien mit einer solchen Struktur exportieren

import First from './First'
import Second from './Second'
/..../
export { First, Second }
19
Igor Dolzhenkov

Sie sollten export {React} ausführen und über import {React} from ./module importieren können.

Weitere Informationen finden Sie unter https://developer.mozilla.org/de/docs/web/javascript/reference/statements/export .

0
sheeldotme

So organisiere ich meine statischen Bilddateien. Ich habe eine neue Datei namens 'Directory.js' erstellt.

const asset = {
    icon: {
        artist: require('./icon/artist.png'),
        artists: require('./icon/artists.png'),
        bookmark: require('./icon/bookmark.png'),
        cameraFlip: require('./icon/camera-flip.png')
    },
    image: {
        color: require('./image/color.png'),
        posting: require('./image/posting.png'),
        newSchool: require('./image/new-school.png'),
        traditional: require('./image/traditional.png')
    }
}

export default asset;

Und hier ist Import.

import asset from './../asset/Directory';

// usage in react native
<Image source={asset.icon.posting} />

Hoffe das hat geholfen!

0
R.Cha

Für meinen Anwendungsfall benötige ich explizit eine explizite Import-Anweisung, damit babel meinen es7-Code nach es5 umwandeln kann. 

Folgendes führt zu einem Fehler You gave us a visitor for the node type "ForAwaitStatement" but it's not a valid type:

require( 'babel-core/register' ); //transpiles es7 to es5
export {default} from './module_name'

Meine Lösung bestand darin, das Modul mithilfe von require() explizit zu importieren:

require( 'babel-core/register' );
export default require( './module_name' ).default;
0
Kacy

Gegebener ./foo.js:

const Foo = class {
  talk() { return 'hello'; }
};

export default Foo;

Dann sollten Sie das können:

import Foo from './foo';

let foo = new Foo();

foo.talk(); // => 'hello';

Die Syntax folgt mehr oder weniger dem commonjs module.exports-Muster.

const Foo = class {

};

module.exports = Foo;

Mehr hier:

http://exploringjs.com/es6/ch_modules.html

0
Rich Apodaca