Em nossa vivência de projeto, algumas arquiteturas de pastas favorecem nosso entendimento de cada módulo do projeto.
No entanto, algumas situações podem nos levar a caminhos extensos, de difícil entendimento e que necessitam obrigatoriamente de se guiar pelo intellisense do vs-code (ou algo similar).
import { Module } from '../../../Folder'
Situações como esta podem se tornar comuns e cansativas ao importar um módulo/componente. E é aí que entra a magia dos caminhos absolutos para importação.
Em nosso arquivo jsconfig.json (ou tsconfig.json pra quem usa TypeScript) - vale ressaltar, se você não tem este arquivo, basta cria-lo na raiz do seu projeto e voilá! - precisamos inserir uma simples regra:
{
"compilerOptions": {
"baseUrl": "src" // <- Este é o nosso cara.
},
"include": ["src"]
}
Modificando nossa baseUrl, podemos definir qual será o caminho para importação, mudando totalmente a forma como importamos componentes dentro da nossa aplicação.
A mesma situação apresentada anteriormente pode se tornar:
import { Module } from 'components/Folder'
Onde components é uma pasta diretamente ramificada de src.
Espero que este breve artigo sirva de algum auxílio!
Top comments (1)
Parabéns bem explicado e didático , conseguir resolve meu problemas rapidinho .