web-dev-qa-db-fra.com

Impossible de trouver le fichier de définition de type pour «nœud» dans l'application TypeScript / React

J'ai remarqué il y a peu de temps, chaque fois que j'essaie de démarrer mon application, je reçois beaucoup de Cannot find name 'require' et Cannot find type definition file for 'node' et un Cannot find type definition for 'react-router'

Voici quelques solutions que j'ai déjà essayées:

1) ajouter un types: ["node"] dans mon tsconfig.json, comme vous pouvez tous le voir ci-dessous.

2) ajouter @types/node dans mon package.json, que vous pouvez tous voir ici.

3) suppression de node_modules et re yarning, en vain. J'ai également supprimé yarn.lock et le problème persiste.

4) Ajout d'un typeRoots: ["node_modules/@types/node"], ce qui ne semblait pas faire grand-chose.

// Package.json 
"devDependencies": {
    "@types/lodash": "^4.14.110",
    "@types/node": "^10.12.18",
    "@types/react": "16.3.12",
    "@types/react-dom": "15.5.0",
    "@types/react-router": "4.0.11",
    "babel-core": "6.26.3",
    "babel-loader": "7.1.5",
    "babel-preset-es2015": "6.24.1",
    "babel-preset-react": "6.24.1",
    "css-loader": "1.0.0",
    "extract-text-webpack-plugin": "2.0.0-beta.4",
    "html-webpack-plugin": "2.24.1",
    "react": "15.5.4",
    "react-dom": "15.5.4",
    "react-router-dom": "4.1.1",
    "rimraf": "2.6.2",
    "style-loader": "0.22.1",
    "ts-loader": "1.2.1",
    "TypeScript": "3.2.2",
    "url-loader": "1.0.1",
    "webpack": "2.2.0",
    "webpack-dev-server": "1.16.2"
  }

//tsconfig.json (at root level)
{
    "compilerOptions": {
    "baseUrl": "./",
    "target": "es2016",
    "pretty": true,
    "module": "commonjs",
    "sourceMap": true,
    "jsx": "preserve",
    "outDir": "./dist/",
    "noImplicitAny": false,
    "preserveConstEnums": true,
    "strict": true,
    "allowSyntheticDefaultImports": true,
    "types": ["node"],
    "paths": {
      "*": ["node_modules/@types/*", "*"]
    }
  },
  "include": [
    "src/**/*"
  ],
  "exclude": [
    "node_modules"
  ]
}

La combinaison tsconfig et package.json ci-dessus génère les erreurs suivantes:

ERROR in ./src/index.tsx
(5,1): error TS2580: Cannot find name 'require'. Do you need to install type definitions for node? Try `npm i @types/node` and then add `node` to the types field in your tsconfig.

ERROR in /Users/johnli/Documents/portfolio/tsconfig.json
error TS2688: Cannot find type definition file for 'node'.

Un comportement étrange que j'ai remarqué est que l'ajout de types: ["node"] effacera mon Cannot find type definition file for 'react-router' mais pas pour node. Ajouter react-router produit l'erreur pour node et react-router et la suppression complète de l'attribut types génère également une erreur pour node et react-router.

Je voudrais m'abstenir d'utiliser declare var require: any comme solution, car cela ne résout pas le cœur du problème et davantage un correctif.

Quelques informations supplémentaires devraient être utiles: la version du nœud est 11.6.0 et la version du fil est 1.13.0

Avez-vous d'autres suggestions pour que cela fonctionne? Je n'arrive pas à trouver d'autres solutions que celles que j'ai essayées ci-dessus. Je peux également fournir plus d'informations si cela est nécessaire. Merci a tous!

javascriptnode.jsreactjstypescripttsconfig
3
john.zli

Essayer

npm install @types/node --save-dev

et dans le fichier tsconfig ajoutez: -

 {
  "compilerOptions": {
    "types": ["node"]
 }

}

6
AConsumer

J'ai réussi à résoudre ce problème;

J'étais sur une version très ancienne du webpack; mise à niveau vers webpack 4, ts-loader vers v5, et après la mise à niveau d'autres plugins webpack, j'ai pu résoudre ce problème de compilation.

Une chose qui m'a fait comprendre qu'il s'agissait peut-être d'un webpack était que VSCode était capable de voir les typages de nœuds parfaitement bien, mais l'ancienne compilation du webpack montrait toujours ces erreurs.

3
john.zli