Pacote alfabit-ds não é reconhecido

Olá Felipe!

Pelo que você descreveu e pela imagem compartilhada, parece que o seu projeto não está conseguindo resolver o caminho para o módulo alfabit-ds/components. Vamos tentar algumas abordagens para resolver esse problema:

1. Verifique se o pacote foi instalado corretamente: Confira se o pacote alfabit-ds está presente na pasta node_modules do seu projeto. Se não estiver, tente instalá-lo novamente usando o comando npm install alfabit-ds ou yarn add alfabit-ds, dependendo do gerenciador de pacotes que você está utilizando.

2. Verifique o caminho de importação: Certifique-se de que o caminho que você está usando na importação dos componentes está correto. Se o pacote alfabit-ds estiver estruturado de forma que os componentes estejam em subpastas, você precisará ajustar o caminho de importação para refletir essa estrutura.

3. Verifique o arquivo de declaração de tipos: Como você está usando TypeScript, é importante que o arquivo de declaração de tipos (usualmente um arquivo .d.ts) esteja configurado corretamente e no local certo. Esse arquivo deve estar na raiz do pacote ou referenciado no package.json sob a chave "types" ou "typings".

4. Verifique o arquivo tsconfig.json: Confira se o seu tsconfig.json está configurado para resolver módulos e tipos adequadamente. Verifique as opções baseUrl, paths e typeRoots para garantir que elas estão corretas.

5. Limpe o cache do seu gerenciador de pacotes e reinstale as dependências: Em alguns casos, o cache pode causar problemas. Você pode tentar limpar o cache com npm cache clean --force ou yarn cache clean e depois reinstalar as dependências.

6. Verifique se há alguma versão específica necessária: Às vezes, a versão do Next pode ser importante. Confira se a versão que você está usando é compatível com o seu projeto ou se há alguma instrução específica sobre a versão no README do pacote. No curso, desenvolvemos com a versão do Next 13, mas ainda usando a organização de pastas e não um diretório app, por exemplo

7. Se atente para as configurações do projeto consumidor: O projeto que irá consumir a biblioteca precisa ser da mesma versão do Next que usamos. Além de que precisa ser também uma aplicação feita com Next.

Esses são apenas alguns pontos que podem está impedindo o uso correto da biblioteca. Se você tiver mais dúvidas, pode tentar seguir novamente o passo a passo realizado em aula para que o projeto rode tranquilamente. Tem um passo a passo para publicar que você pode acessar a aula e o vídeo especifico clicado aqui. E tem um passo a passo para consumir a biblioteca que você acessa a aula e o vídeo específico clicando aqui.

Espero ter ajudado e bons estudos!

Boa tarde Neilton

Obrigado pelo retorno,

Acredito que seja devido ao meu projeto consumidor do Design System, utilizar Typescript, pois mesmo declarando o um "module" para definir um tipo (janela do lado direito na imagem abaixo - adicionei a declaração dentro do próprio arquivo de tipos do next apenas para testes e por já ser definido no tsconfig), no VS Code não é apresentado o erro, mas na hora de efetuar o build é gerada a mensagem.

• O design system que fiz durante as aulas optei por fazer em typescript, e para testar o consumo do projeto demo, utilizei o DS disponibilizado no npm em aula, ou seja, o que está em JS.

• Alterei a versão do Next para a mesma do DS disponibilizado no npm

Acredito que se eu criar um novo em JS igual ao do curso irá funcionar perfeitamente.

Fiquei curioso no seguinte ponto: Sei que um projeto feito em Typescript pode consumir e utilizar bibliotecas externas construídas em JS normalmente, e como tais bibliotecas não teriam a instalação em nível de devDepencies que geralmente é separada e indicada para instalar como "npm install -D @types/NOME_DA_BIBLIOTECA" Logo na aplicação consumidora teria que ter a definição de tipos do module, conforme na imagem abaixo na segunda aba, porém definindo cada item e componente interno da biblioteca, (um exemplo de definições internas https://github.com/DefinitelyTyped/DefinitelyTyped/blob/master/types/react/v17/index.d.ts)

Faz sentido esse pensamento?

Obrigado

Felipe D. R