Definitelytyped: Tidak dapat menemukan modul 'csstype'

Dibuat pada 7 Apr 2018 · 21Komentar · Sumber: DefinitelyTyped/DefinitelyTyped

Hai, saya mencoba menggunakan reaksi dengan TypeScript, saya menginstal ( react , react-dom ), ( @types/react , @types/react-dom ), dalam upaya meluncurkan proyek Saya mendapatkan kesalahan ERROR in [at-loader] ./node_modules/@types/react/index.d.ts:55:22 Cannot find module 'csstype' . Saya mencoba npm i csstype di @types/react dan di root proyek. Juga meskipun ada kesalahan, di modul @types/react ada folder node_modules/csstype, jadi saya bahkan tidak tahu mengapa kesalahan ini terjadi.

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"
  }
}

sumber/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')
);

OS: Ubuntu 17.10

Sumber

liketurbo

👍35 ❤2

Komentar yang paling membantu

Coba compilerOptions.moduleResolution: "node"

(Edit oleh Orta: Jika Anda melihat ini di dalam PastiTyped, Anda perlu menjalankan npm install dalam ketergantungan tempat Anda melihat kesalahan itu. Misalnya cd types/react; npm install dan kemudian daftar harus lebih baik - lihat https: //github.com/microsoft/dtslint/issues/226 )

frenic pada 8 Apr 2018

👍97 🎉12 🚀6 😕3

Semua 21 komentar

Coba compilerOptions.moduleResolution: "node"

frenic pada 8 Apr 2018

👍97 🎉12 🚀6 😕3

Saya memiliki kesalahan ini juga.

moduleResolution: true memberi saya kesalahan - dan tidak tercantum dalam dokumen sebagai nilai yang valid - tetapi menyetel moduleResolution: "node" sepertinya berhasil 👍 Terima kasih!

bencoveney pada 8 Apr 2018

🎉1 👍1

Maaf, saya bermaksud mengatakan "node" Mengubah komentar saya. Senang itu membantu.

frenic pada 8 Apr 2018

👍1

Set "moduleResolution": "node" berguna untuk saya juga.

HJava pada 8 Mei 2018

👍3

Terima kasih Frenik. Bekerja untuk saya juga.

valvic66 pada 23 Mei 2018

Ada yang bisa kasih warna kenapa? Apakah ada pembaruan yang membuat pengaturan ini tidak perlu?

jcrben pada 19 Jun 2018

Jika compilerOptions.module === "AMD" or "System" or "ES6" default untuk compilerOptions.moduleResolution adalah "Classic" , jika tidak "Node" . Jadi, jika Anda menggunakan salah satu dari strategi modul ini, tetapi semua paket Anda berada di bawah node_modules . compilerOptions.moduleResolution harus disetel ke "Node" .

Untuk Classic :

Namun, untuk impor modul non-relatif, kompiler berjalan ke atas pohon direktori dimulai dengan direktori yang berisi file pengimpor, mencoba mencari file definisi yang cocok.

Untuk Node :

Node akan mencari modul Anda di folder khusus bernama node_modules. Folder node_modules dapat berada pada level yang sama dengan file saat ini, atau lebih tinggi dalam rantai direktori. Node akan berjalan ke atas rantai direktori, melihat melalui setiap node_modules sampai menemukan modul yang Anda coba muat.

( sumber )

frenic pada 19 Jun 2018

👍6 🎉1

"module": "commonjs" memperbaiki masalah ini untuk saya, coba.

svipas pada 28 Jun 2018

👍1

Bagi mereka yang menggunakan resolusi modul classic yang _tidak_ ingin mengubah ke resolusi modul node , saya dapat mengatasi masalah ini dengan menambahkan entri paths untuk csstype di tsconfig.json saya, karena proyek saya menggunakan opsi konfigurasi baseUrl . Lihat dokumentasi baseUrl untuk lebih jelasnya.

Jelas, ini bukan pendekatan yang dapat diskalakan jika Anda memiliki banyak konflik seperti ini, tetapi ini adalah pertama kami dan ini setidaknya memberi kami waktu jika kami ingin mempertimbangkan untuk beralih ke resolusi modul node .

austinbruch pada 5 Jul 2018

Saya juga mengalami hal ini.

Melalui WebPack + TypeScript

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

Apa yang memperbaikinya untuk saya, yang mungkin cukup hackey, tetapi pada TS 2.9 Anda dapat mengetik import() (https://blogs.msdn.microsoft.com/typescript/2018/05/31/announcing-typescript -2-9/#import-types), jadi saya melakukan ini dan mengkompilasi sekarang tanpa keluhan:

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

aventurella pada 26 Sep 2018

👍1

Hai. Terima kasih atas saran di sini pengaturan compilerOptions.moduleResolution: "node" .
Namun sayangnya, moduleResolution sudah ditetapkan sebagai "simpul" ketika saya membuat proyek menggunakan create-react-app-typescript tapi saya masih melihat masalahnya.

Saya akan terus memeriksa tetapi akan lebih bagus jika seseorang sudah tahu jawabannya dan dapat memberi tahu saya cara memperbaikinya :-)

PEMBARUAN: maaf ini adalah pengaturan saya yang buruk - ada tsconfig.test.json yang memiliki modul yang ditetapkan sebagai commonjs dan menambahkan "moduleResolution": "node" tampaknya telah memperbaikinya.

htbkoo pada 15 Okt 2018

Saya memeriksa types/react-tag-autocomplete dan menjalankan npm run lint react-tag-autocomplete . Mendapatkan kesalahan yang sama, error TS2307: Cannot find module 'csstype' .

Setelah menambahkan "moduleResolution": "node", di compilerOptions dari react-tag-complete 's tsconfig.json , itu memberikan kesalahan: Error: Unexpected compiler option moduleResolution .

Ada bantuan?

Rahul-Sagore pada 28 Mar 2019

Ini membuat saya gila mencoba membuat definisi tipe yang bergantung pada reaksi. Ternyata perpustakaan csstype memiliki definisi TS sendiri, yang karenanya tidak ada di direktori /types dari repo ini. Saya membuat masalah di dtslint untuk mengatasi ini:

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

mike-marcacci pada 3 Apr 2019

Bagi saya, menyetel param moduleResolution tidak berfungsi, jadi saya secara manual melakukan solusi yang telah disarankan oleh @mike-marcacci di PR yang ia angkat di repo dtslint :

cd types/react
npm i

nossbigg pada 25 Mei 2019

👍20 🎉2

@Rahul-Sagore Saya mendapatkan kesalahan yang sama seperti Anda. Apakah Anda pernah mencari cara untuk menyelesaikan ini?

mcmar pada 11 Jun 2019

@mcmar Tidak.

Rahul-Sagore pada 12 Jun 2019

@Rahul-Sagore Saya mendapatkan kesalahan yang sama seperti Anda. Apakah Anda pernah mencari cara untuk menyelesaikan ini?

Anda harus menginstal dependensi types/react dan itu akan berhasil :)

seperti yang ditunjukkan dalam balasan ini https://github.com/DefinitelyTyped/DefinitelyTyped/issues/24788#issuecomment -495861835

agustin107 pada 28 Jun 2019

Saya juga punya masalah ini.

Pengaturan "moduleResolution": "node", memberi saya kesalahan Error: Unexpected compiler option moduleResolution
Saya sudah mencoba untuk

    cd types\react
    npm i

Kemudian menjalankan npm run lint <my-package> menunjukkan banyak kesalahan dengan csstype like

../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.

Dan beberapa ratus baris serupa

fyodore82 pada 2 Jul 2019

👍5

Kesalahan yang sama seperti @ fyodore82 setelah melakukan langkah 1/2

DanceParty pada 21 Jul 2019

Selesaikan dengan menulis "simpul" dengan huruf kapital "N":

"moduleResolution": "Node"

Bekerja di pihak kita.

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

flearsnetwork pada 31 Jul 2019

👍4

Solusi "moduleResolution": "Node" tidak memperbaikinya untuk saya, tetapi masuk ke direktori /types/react dan menjalankan npm install menyelesaikan masalah.