Incluso después de ver el código React de muestra en línea, todavía no podía entender el método de import
.
En mi punto de entrada de "index.tsx", existe la siguiente declaración de importación; sin embargo, no puedo encontrar "App" o "ThemeProvider" en ./components
import { App, ThemeProvider } from './components';
Pero en lugar de esto, cuando veo "components/index.ts" dice:
export * from './common'; export * from './pages'; export * from './layout';
¿Hay alguna lógica detrás de esto? ¿Cómo/dónde se define esta ruta de importación? ¿Tiene "components/index.ts" alguna forma especial de funcionar?
Aquí están mis estructuras de directorio:
├── components │ ├── common │ ├── index.ts │ ├── layout │ └── pages ├── constants │ ├── external-links.ts │ ├── faq-entries.ts │ ├── index.ts │ └── page-size.ts ├── index.css ├── index.tsx ├── logo.svg ├── react-app-env.d.ts ├── setupProxy.js └── types ├── faq.ts ├── index.ts └── page.ts
cuando haces un
import { App, ThemeProvider } from './components';
y dado que no está especificando un archivo, la resolver
busca automáticamente un index.js
o index.ts
dentro de la carpeta (aquí en los componentes de su caso).
Entonces este código:
export * from './common'; export * from './pages'; export * from './layout';
está exportando todo su formulario de export
de los archivos enumerados.