javascript - implement - ¿Es posible realizar importaciones de múltiples clases con ES6/Babel?

babel-cli

Question

Estoy trabajando en un proyecto de reacción (el primero) y recientemente he reestructurado la estructura de mi carpeta para que tenga un poco más de sentido.

Para hacer mi vida más fácil, dentro de mis carpetas de componentes, tengo un archivo index.js que se parece a lo siguiente:

export * from ''./App'';
export * from ''./Home'';
export * from ''./PageWrapper'';

(La idea se levantó de otra pregunta de StackOverflow )

En este caso, cada uno de los archivos de este índice apunta a tener una clase singular de exportación.

Ahora en mi aplicación principal, intento hacer algo como:

import {Home, App} from ''./containers/index'';
//or
import Home from ''./containers/index'';

Nada funciona. Descubrí que si los separo en líneas individuales que apuntan directamente al archivo correcto, funciona.

import Home from ''./containers/Home'';
import App from ''./containers/App'';

Entonces, ¿es posible importar varias clases de la forma en que lo hago, y simplemente no lo veo? ¿Quizás necesito nombrarlos a todos ( App as App )? ¿O es esto simplemente una limitación forzada?

Answer 1

Puedes exportar así:

import App from ''./App'';
import Home from ''./Home'';
import PageWrapper from ''./PageWrapper'';

export {
    App,
    Home,
    PageWrapper
}

Luego, puedes importar así cuando lo necesites:

import { App, PageWrapper } from ''./index'' //or similar filename

...

Puedes leer más sobre import y export aquí. También respondí una pregunta similar here .

Answer 2

Yo uso la exportación que se ve algo como esto. En reaccionó funcionó bien.

export {default as PublicRoute} from ''./PublicRoute'';
export {default as PrivateRoute} from ''./PrivateRoute'';

Entonces, puedes importar así cuando necesites:

import {PublicRoute, PrivateRoute} from ''./config/router'';
...