Nuestro team de expertos pasados muchos días de trabajo y recopilación de de información, dieron con la respuesta, deseamos que te sea de utilidad en tu proyecto.
Solución:
La forma en que solemos usar import se basa en la ruta relativa.
. y .. son similares a cómo usamos para navegar en terminal me gusta cd .. salir del directorio y mv ~/file . mover un file al directorio actual.
my-app/
node_modules/
package.json
src/
containers/card.js
components/header.js
App.js
index.js
En tu caso, App.js es en src/ directorio mientras header.js es en src/components. Para import tu harías import Header from './components/header'. Esto se traduce aproximadamente en mi directorio actual, busque la carpeta de componentes que contiene un archivo de encabezado.
Ahora bien, si de header.jsnecesitas import algo de cardharías esto. import Card from '../containers/card'. Esto se traduce en, salir de mi directorio actual, buscar contenedores de nombre de carpeta que tengan un archivo de tarjeta.
Como para import React, Component from 'react'esto no comienza con un ./ o ../ o / por lo tanto, el nodo comenzará a buscar el módulo en el node_modules en un orden específico hasta react es encontrado. Para una comprensión más detallada, se puede leer aquí.
Si crea una aplicación con react-create-app, no olvide establecer la variable de entorno:
NODE_PATH=./src
O añadir a .env archivo a su carpeta raíz;
agregando NODE_PATH como variable de entorno en .env está en desuso y se reemplaza agregando "baseUrl": "./src"para compilerOptions en jsconfig.json o tsconfig.json.
Referencia
Puntuaciones y comentarios
Si sostienes algún problema y disposición de beneficiar nuestro post puedes realizar un paráfrasis y con mucho gusto lo interpretaremos.