Pesquisa de site

TypeScript e React Native, centenas de erros de node_modules/@types ao compilar


Atualmente estou migrando meu projeto RN para TypeScript. Eu terminei a maior parte do meu código JS, e agora, quando executo tsc, recebo várias centenas de erros que parecem ser todos

error TS 2717: Subsequent property declarations must have the same type. Property
  prop must be of the type TYPE,
  but here has type TYPE

por exemplo:

error TS2717: Subsequent property declarations must have the same type.  Property
  'view' must be of type 'SVGProps<SVGViewElement>',
  but here has type 'SVGProps<SVGViewElement>'.

o que é duplamente confuso porque os tipos listados são quase sempre idênticos.

Sou capaz de executar meu aplicativo, ainda estou recebendo mensagens úteis do tslint, e quaisquer erros específicos do meu código aparecem na parte inferior da lista de erros do compilador.

Meu tsconfig.json atualmente é:

{
  "compilerOptions": {
    "allowJs": true,
    "target": "es2018",
    "outDir": "dist",
    "module": "commonjs",
    "sourceMap": true,
    "lib": ["esnext", "es7", "dom", "es6"],
    "jsx": "react-native",
    "strict": true,
    "allowSyntheticDefaultImports": true,
    "esModuleInterop": true,
    "experimentalDecorators": true,
    "emitDecoratorMetadata": true,
    "types": ["react-native"]
  },
  "include": ["src/**/*"],
  "exclude": ["node_modules", "**/*.spec.ts"]
}

Eu tentei várias soluções, incluindo configurar types para [] conforme a documentação do TypeScript e configurar exclude para várias formas de node_modules como ./node_modules, node_modules/* etc., mas nenhuma dessas mudanças teve algum efeito.

Resposta #1

Ok, consegui resolver isso. Não tenho certeza de como as dependências são gerenciadas via yarn, mas meu problema era definitivamente relacionado a dependências.

Primeiro eu removi todas as minhas bibliotecas @types/* das minhas dependências e, em seguida, deletei a pasta node_modules.

Então, apesar do que a maioria dos tutoriais e guias dirão, eu instalei apenas @types/react-native e não @types/react. @types/react-native adicionou as tipagens do React por conta própria. Estou pensando que as tipagens para @types/react talvez dependessem das tipagens do Node, e ao instalá-las explicitamente eu introduzi um monte de conflitos tanto entre @types/react-native e @types/node quanto entre @types/react-native e @types/react. Meu projeto compila sem erros agora.

Resposta #2

A causa raiz do problema parece ser o compilador TypeScript verificando as bibliotecas. Adicionar skipLibCheck: true ao tsconfig.json pula a verificação das bibliotecas.

Veja Como forçar o tsc a ignorar a pasta node_modules? para uma explicação detalhada.

Artigos relacionados