Definitelytyped: No se puede encontrar el módulo 'csstype'

Creado en 7 abr. 2018  ·  21Comentarios  ·  Fuente: DefinitelyTyped/DefinitelyTyped

Hola, estoy tratando de usar reaccionar con mecanografiado, instalé ( react , react-dom ), ( @types/react , @types/react-dom ), en un intento de iniciar el proyecto Recibo el error ERROR in [at-loader] ./node_modules/@types/react/index.d.ts:55:22 Cannot find module 'csstype' . Intenté npm i csstype en @types/react y en la raíz del proyecto. Además, a pesar del error, en el módulo @types/react existe la carpeta node_modules / csstype, por lo que ni siquiera sé por qué ocurre este error.

tsconfig.json

{
    "compilerOptions": {
        "outDir": "./build/", // path to output directory
        "strictNullChecks": true, // enable strict null checks as a best practice
        "module": "es6", // specify module code generation
        "jsx": "react", // use typescript to transpile jsx to js
        "target": "es5", // specify ECMAScript target version
        "allowJs": true, // allow a partial TypeScript and JavaScript codebase

        "noImplicitAny": true,
        "noImplicitReturns": true,
        "noUnusedLocals": true,
        "noUnusedParameters": true,
    },
    "exclude": [
        "node_modules"
    ],
    "include": [
        "./source/**/*.tsx",
        "./source/**/*.ts"
    ]
}

package.json

{
  "name": "suggestion-app",
  "version": "1.0.0",
  "main": "index.js",
  "license": "MIT",
  "scripts": {
    "webpack:server": "babel-node node_modules/.bin/webpack-dev-server --mode=development"
  },
  "dependencies": {
    "react": "^16.3.1",
    "react-dom": "^16.3.1"
  },
  "devDependencies": {
    "@types/react": "^16.3.5",
    "@types/react-dom": "^16.0.4",
    "babel-cli": "^6.26.0",
    "babel-preset-env": "^1.6.1",
    "babel-preset-stage-3": "^6.24.1",
    "caniuse-lite": "^1.0.30000697",
    "clean-webpack-plugin": "^0.1.19",
    "css-loader": "^0.28.11",
    "eslint": "^4.19.1",
    "eslint-config-airbnb": "^16.1.0",
    "eslint-plugin-import": "^2.10.0",
    "eslint-plugin-jsx-a11y": "^6.0.3",
    "eslint-plugin-react": "^7.7.0",
    "file-loader": "^1.1.11",
    "glob": "^7.1.2",
    "html-webpack-plugin": "^3.2.0",
    "mini-css-extract-plugin": "^0.4.0",
    "postcss-cssnext": "^3.1.0",
    "postcss-loader": "^2.1.3",
    "purify-css": "^1.2.5",
    "purifycss-webpack": "^0.7.0",
    "script-ext-html-webpack-plugin": "^2.0.1",
    "webpack": "^4.5.0",
    "webpack-cli": "^2.0.14",
    "webpack-dev-server": "^3.1.1"
  }
}

fuente / index.ts

import * as React from 'react';
import * as ReactDOM from 'react-dom';
import './styles/main.css';

ReactDOM.render(
  <h1>Hello, world!</h1>,
  document.getElementById('root')
);

SO: Ubuntu 17.10

Comentario más útil

Prueba compilerOptions.moduleResolution: "node"


(Edite por Orta: si está viendo esto dentro de DefinitelyTyped, debe ejecutar npm install en la dependencia donde está viendo ese error. Por ejemplo, cd types/react; npm install y luego la lista debería ser mejor; consulte https: //github.com/microsoft/dtslint/issues/226)

Todos 21 comentarios

Prueba compilerOptions.moduleResolution: "node"


(Edite por Orta: si está viendo esto dentro de DefinitelyTyped, debe ejecutar npm install en la dependencia donde está viendo ese error. Por ejemplo, cd types/react; npm install y luego la lista debería ser mejor; consulte https: //github.com/microsoft/dtslint/issues/226)

También tuve este error.

moduleResolution: true me da errores, y no aparece en los documentos como un valor válido, pero la configuración de moduleResolution: "node" parece que ha hecho el trabajo 👍 ¡Gracias!

Lo siento, quise decir "node" 😆 Cambié mi comentario. Me alegro de que haya ayudado.

El conjunto "moduleResolution": "node" también me resulta útil.

Gracias Frenic. Funciona para mí también.

¿Alguien puede dar color sobre por qué? ¿Hay alguna actualización que haría innecesario configurar esto?

Si compilerOptions.module === "AMD" or "System" or "ES6" el valor predeterminado para compilerOptions.moduleResolution sería "Classic" , de lo contrario es "Node" . Entonces, si usa una de estas estrategias de módulo, pero tiene todos sus paquetes por debajo de node_modules . El compilerOptions.moduleResolution debe establecerse en "Node" .

Por Classic :

Sin embargo, para las importaciones de módulos no relativos, el compilador recorre el árbol de directorios comenzando con el directorio que contiene el archivo de importación, tratando de localizar un archivo de definición coincidente.

Por Node :

Node buscará sus módulos en carpetas especiales llamadas node_modules. Una carpeta node_modules puede estar en el mismo nivel que el archivo actual o más arriba en la cadena de directorios. Node recorrerá la cadena de directorios, mirando a través de cada node_modules hasta que encuentre el módulo que intentó cargar.

( fuente )

"module": "commonjs" solucionó este problema, pruébalo.

Para aquellos que usan la resolución del módulo classic que _no_ quieren cambiar a la resolución del módulo node , pude solucionar este problema agregando una entrada paths para csstype en mi tsconfig.json , ya que mi proyecto está usando la opción de configuración baseUrl . Consulte la documentación de baseUrl para obtener más detalles.

Obviamente, este no es un enfoque escalable si tiene muchos conflictos como este, pero este fue el primero y al menos nos ha dado algo de tiempo si queremos considerar cambiar a la resolución del módulo node .

Yo también me estaba encontrando con esto.

A través de WebPack + TypeScript

Module not found: Error: Can't resolve 'csstype' 

Lo que me solucionó, que probablemente sea bastante hackey, pero a partir de TS 2.9 puede import() types (https://blogs.msdn.microsoft.com/typescript/2018/05/31/announcing-typescript -2-9 / # import-types), así que hice esto y se compila ahora sin quejas:

type VisibilityProperty = import('csstype').VisibilityProperty;
type AnimationProperty = import('csstype').AnimationProperty;

Hola. Gracias por la sugerencia aquí de configurar compilerOptions.moduleResolution: "node" .
Sin embargo, desafortunadamente, moduleResolution ya está configurado como "nodo" cuando creé el proyecto usando create-react-app-typescript, pero sigo viendo el problema.

Seguiré comprobando, pero sería genial si alguien ya supiera la respuesta y me pueda decir cómo solucionarlo :-)

ACTUALIZACIÓN: lo siento, es mi configuración incorrecta: hay un tsconfig.test.json que tiene un módulo configurado como commonjs y agregar "moduleResolution": "node" parece haberlo solucionado.

Estoy revisando types/react-tag-autocomplete y ejecutando npm run lint react-tag-autocomplete . Obteniendo el mismo error, error TS2307: Cannot find module 'csstype' .

Después de agregar "moduleResolution": "node", en compilerOptions de react-tag-complete 's tsconfig.json , da error: Error: Unexpected compiler option moduleResolution .

¿Alguna ayuda?

Esto me volvió loco al intentar crear una definición de tipo que dependiera de reaccionar. Resulta que la biblioteca csstype tiene sus propias definiciones de TS, que por lo tanto no están presentes en el directorio /types de este repositorio. Creé un problema en dtslint para abordar esto:

https://github.com/Microsoft/dtslint/issues/226

Para mí, configurar el parámetro moduleResolution no funcionó, así que realicé manualmente la solución a la que @ mike-marcacci ya había sugerido en el PR que recaudó en el repositorio dtslint :

cd types/react
npm i

@ Rahul-Sagore Recibo el mismo error que tú. ¿Alguna vez averiguaste cómo resolver esto?

@mcmar Nope.

@ Rahul-Sagore Recibo el mismo error que tú. ¿Alguna vez averiguaste cómo resolver esto?

Tienes que instalar dependencias de types/react y eso funcionará :)

como se indica en esta respuesta https://github.com/DefinitelyTyped/DefinitelyTyped/issues/24788#issuecomment -495861835

También tengo este problema.

  1. Configurar "moduleResolution": "node", me da error Error: Unexpected compiler option moduleResolution
  2. He intentado
    cd types\react
    npm i

Luego, ejecutar npm run lint <my-package> me muestra una gran cantidad de errores con csstype como

../react/node_modules/csstype/index.d.ts(2071,31): error TS1005: '(' expected.
../react/node_modules/csstype/index.d.ts(2083,19): error TS2693: 'LetterSpacingProperty' only refers to a type, but is being used as a value here.
../react/node_modules/csstype/index.d.ts(2083,49): error TS1005: '(' expected.
../react/node_modules/csstype/index.d.ts(2096,15): error TS2693: 'LineBreakProperty' only refers to a type, but is being used as a value here.

Y varios cientos de líneas similares

Mismo error que @ fyodore82 después de realizar los pasos 1/2

Resuélvalo escribiendo "nodo" con una "N" mayúscula:

"moduleResolution": "Node"

Trabaja de nuestro lado.

https://www.typescriptlang.org/docs/handbook/compiler-options.html

La solución "moduleResolution": "Node" no lo solucionó, pero entrar en el directorio /types/react y ejecutar npm install resolvió el problema.

¿Fue útil esta página
0 / 5 - 0 calificaciones