Pesquisa de site

typescript - Posso usar arquivos de declaração de tipos do node_modules sem importar os módulos reais?


Estou carregando a biblioteca de imagens teachable machine usando uma tag de script:

 <script src="https://cdn.jsdelivr.net/npm/@teachablemachine/[email /dist/teachablemachine-image.min.js"></script>

No meu projeto em TypeScript, eu uso o código tmImage da seguinte forma:

let model = await tmImage.load(modelURL, metadataURL)

O que gera este erro em Typescript:

cannot find name `tmImage`

Então, eu preciso de arquivos de declaração de tipo, que não estão disponíveis em https://github.com/DefinitelyTyped/, mas ESTÃO disponíveis no próprio módulo. Então, eu o instalei usando:

npm install @teachablemachine/image

Agora, dentro de node_modules há muitos arquivos .d.ts de referência cruzada que contêm todas as informações de tipo necessárias.

Eu presumi que o Visual Studio Code pegaria automaticamente todas as informações dos arquivos .d.ts no meu projeto, mas isso só acontece quando eu realmente importo os módulos com:

import * as tmImage from '@teachablemachine/image';

Agora os tipos SÃO reconhecidos muito bem com a conclusão de código, mas eu também preciso compilar o código da máquina ensinável junto com o meu próprio código!

É possível usar apenas as informações de tipo de node_modules durante o tempo de desenvolvimento, ou eu preciso abandonar minha tag <script> e compilar todo o código do teachable machine eu mesmo, apenas porque uso Typescript?

Resposta #1

Você não está compilando a biblioteca toda vez, você está apenas importando-a. A biblioteca já está compilada dentro de node_modules. Então, você pode usar os imports e excluí-los do seu bundler se você estiver usando um.

Se você quiser que os tipos estejam disponíveis globalmente, você precisa adicionar um arquivo .d.ts ao seu projeto. O TS não assume que um tipo está disponível apenas porque ele está no node_modules, mas você pode adicionar isso estendendo o namespace global assim:

// In a `.d.ts` file within the included folders of your project
import * as _tmImage from '@teachablemachine/image';

declare global {
    const tmImage: typeof _tmImage;
}