Ré-exportation par défaut dans les modules ES 6

Question

Dans ES6, est-il possible de raccourcir le code suivant. J'ai un App.js et un fichier index.js .

index.js

import App from './App';

export default App;

Quelque chose comme ça

index.js

export default App from './App.js'

Answer 1

Si vous utilisez proposal-export-default-from Plugin Babel (qui fait partie de stage-1 préréglé ), vous pourrez réexporter le défaut en utilisant le code suivant :

export default from "./App.js"

Pour plus d'informations, voir la proposition ECMAScript .

---

Une autre façon (sans ce plugin) est :

export { default as App } from "./App.js"

---

Ce qui précède est une pratique très courante lorsque des fichiers séparés, chacun avec son propre export ont tous quelque chose en commun, par exemple, utils Ainsi, si l'on souhaite, par exemple, importer 3 utilitaire au lieu de devoir écrire plusieurs importations :

import util_a from 'utils/util_a' 
import util_b from 'utils/util_b' 
import util_c from 'utils/util_c' 

On peut importer n'importe quel utilitaire sur une seule ligne :

import { util_a, util_b , util_c } from 'utils' 

En créant un index.js dans le fichier /utils et importer toutes les valeurs par défaut de tous les utilitaires qui s'y trouvent, puis les réexporter, de sorte que la index servira de "passerelle" pour toutes les importations liées à ce dossier.

Answer 2

C'est un peu une répétition des réponses précédentes, mais pour clarifier la différence entre deux options :

1. Exportation par défaut

(Cela semble être ce que le PO veut)

export { default } from './App'

// in a different file
import App from './index'

2. nommé exportation

export { default as App } from './App'

// in another file
import { App } from './index'

Ceux-ci fonctionneront avec react comme l'a fait vsync réponse États.

Answer 3

import App from './App';

export default App;

Babel 7 (avec @babel/preset-react ) peut transformer les éléments ci-dessous :

export { default as App } from './App.js';

---

Discussions connexes :

• Proposition du TC39 : https://github.com/tc39/proposal-export-default-from#common-concerns

Answer 4

La seule solution qui fonctionne est :

import App from './App';

export default App;

Si vous exportez votre module comme ceci

export { default as App } from './App.js';

Dans ce cas, il ne s'agit plus d'une exportation par défaut et vous obtiendrez une erreur si vous essayez de l'importer en tant qu'importation par défaut.

Answer 5

import App from './App';
export default (App);

Cela fonctionne pour moi dans l'application par défaut 'create-react-app'.