Tidak dapat menemukan file pernyataan untuk 'modul-nama' modul. '/path/to/module-name.js' secara implisit memiliki tipe 'apa saja'

Saya membaca cara kerja resolusi modul TypeScript .

Saya memiliki repositori berikut: @ ts-stack / di . Setelah mengkompilasi struktur direktori adalah sebagai berikut:

├── dist
│   ├── annotations.d.ts
│   ├── annotations.js
│   ├── index.d.ts
│   ├── index.js
│   ├── injector.d.ts
│   ├── injector.js
│   ├── profiler.d.ts
│   ├── profiler.js
│   ├── providers.d.ts
│   ├── providers.js
│   ├── util.d.ts
│   └── util.js
├── LICENSE
├── package.json
├── README.md
├── src
│   ├── annotations.ts
│   ├── index.ts
│   ├── injector.ts
│   ├── profiler.ts
│   ├── providers.ts
│   └── util.ts
└── tsconfig.json

Dalam package.json saya saya tulis "main": "dist/index.js".

Di Node.js semuanya berfungsi dengan baik, tetapi TypeScript:

import {Injector} from '@ts-stack/di';

Tidak dapat menemukan file deklarasi untuk modul '@ ts-stack / di'. '/path/to/node_modules/@ts-stack/di/dist/index.js' secara implisit memiliki tipe 'apa saja'.

Namun, jika saya mengimpor sebagai berikut, maka semuanya berfungsi:

import {Injector} from '/path/to/node_modules/@ts-stack/di/dist/index.js';

Apa yang saya lakukan salah?

Berikut ini dua solusi lain

Ketika modul bukan milik Anda - cobalah untuk menginstal jenis dari @types:

npm install -D @types/module-name

Jika kesalahan pemasangan di atas - coba ubah importpernyataan ke require:

// import * as yourModuleName from 'module-name';
const yourModuleName = require('module-name');

Jika Anda mengimpor modul pihak ketiga 'foo'yang tidak menyediakan pengetikan apa pun, baik di perpustakaan itu sendiri, atau dalam @types/foopaket (dihasilkan dari repositori DefinitelyTyped ), maka Anda dapat membuat kesalahan ini hilang dengan mendeklarasikan modul dalam file dengan .d.tsekstensi. TypeScript mencari .d.tsfile di tempat yang sama yang akan mencari .tsfile normal : seperti ditentukan dalam "file", "termasuk", dan "kecualikan" di tsconfig.json.

// foo.d.ts
declare module 'foo';

Kemudian ketika Anda mengimpornya foohanya akan diketik sebagai any.

Sebagai alternatif, jika Anda ingin menggulung ketikan Anda sendiri, Anda juga dapat melakukannya:

// foo.d.ts
declare module 'foo' {
    export function getRandomNumber(): number
} 

Maka ini akan dikompilasi dengan benar:

import { getRandomNumber } from 'foo';
const x = getRandomNumber(); // x is inferred as number

Anda tidak harus memberikan pengetikan penuh untuk modul, cukup untuk bit yang sebenarnya Anda gunakan (dan ingin pengetikan yang tepat), jadi itu sangat mudah dilakukan jika Anda menggunakan API dalam jumlah yang cukup kecil.

Di sisi lain, jika Anda tidak peduli tentang pengetikan pustaka eksternal dan ingin semua pustaka tanpa pengetikan diimpor any, Anda dapat menambahkan ini ke file dengan .d.tsekstensi:

declare module '*';

Keuntungan (dan kerugian) dari ini adalah Anda dapat mengimpor apa saja dan TS akan dikompilasi.

Jika Anda perlu perbaikan cepat, cukup tambahkan ini sebelum baris impor Anda:

// @ts-ignore

Perasaan itu ketika Anda melihat keluar selama dua hari dan menemukannya seperti ini: cukup hapus .jsdari "main": "dist/index.js"dalam package.jsondan semuanya bekerja dengan baik!

"main": "dist/index",

UPD : jawaban ini relatif jika Anda memiliki paket npm Anda sendiri, jika tidak - lihat jawaban saya di bawah ini .

Dan jika jawaban di atas tidak diselesaikan impor modul Anda, coba tambahkan saja typingsdi package.json:

"main": "dist/index",
"typings": "dist/index",

Tentu saja, di sini folder dist- ini tempat menyimpan file modul Anda.

TypeScript pada dasarnya menerapkan aturan dan menambahkan tipe ke kode Anda untuk membuatnya lebih jelas dan lebih akurat karena kurangnya kendala dalam Javascript. TypeScript mengharuskan Anda untuk menggambarkan data Anda, sehingga kompiler dapat memeriksa kode Anda dan menemukan kesalahan. Kompiler akan memberi tahu Anda jika Anda menggunakan tipe yang tidak cocok, jika Anda berada di luar jangkauan Anda atau Anda mencoba mengembalikan tipe yang berbeda. Jadi, ketika Anda menggunakan pustaka dan modul eksternal dengan TypeScript, mereka harus berisi file yang menjelaskan tipe dalam kode itu. File-file itu disebut jenis file pernyataan dengan ekstensi d.ts. Sebagian besar tipe deklarasi untuk modul npm sudah ditulis dan Anda dapat memasukkannya menggunakan npm install @types/module_name(di mana module_name adalah nama modul yang jenisnya ingin Anda sertakan).

Namun, ada modul yang tidak memiliki definisi tipenya dan untuk membuat kesalahan hilang dan mengimpor modul menggunakan import * as module_name from 'module-name', buat folder typingsdi root proyek Anda, di dalam buat folder baru dengan nama modul Anda dan di dalamnya folder buat module_name.d.tsfile dan tulis declare module 'module_name'. Setelah ini hanya pergi ke Anda tsconfig.jsonberkas dan menambahkan "typeRoots": [ "../../typings", "../../node_modules/@types"]dalam compilerOptions(dengan path relatif tepat untuk folder Anda) untuk membiarkan naskah tahu di mana ia dapat menemukan jenis definisi perpustakaan dan modul dan menambahkan properti baru "exclude": ["../../node_modules", "../../typings"]untuk file. Berikut ini adalah contoh tampilan file tsconfig.json Anda:

{
    "compilerOptions": {
        "module": "commonjs",
        "noImplicitAny": true,
        "sourceMap": true,
        "outDir": "../dst/",
        "target": "ESNEXT",
        "typeRoots": [
            "../../typings",
            "../../node_modules/@types"
        ]
    },
    "lib": [
            "es2016"
    ],
    "exclude": [
        "../../node_modules",
        "../../typings"
    ]
}

Dengan melakukan ini, kesalahan akan hilang dan Anda akan dapat tetap berpegang pada aturan ES6 dan TypeScript terbaru.

Untuk orang lain yang membaca ini, coba ganti nama file .js Anda menjadi .ts

Sunting: Anda juga dapat menambahkan "allowJs": trueke file tsconfig Anda.

Cara ini bekerja untuk saya:

declare module 'Injector';

  {
    "compilerOptions": {
        "strictNullChecks": true,
        "moduleResolution": "node",
        "jsx": "react",
        "noUnusedParameters": true,
        "noUnusedLocals": true,
        "allowSyntheticDefaultImports":true,
        "target": "es5",
        "module": "ES2015",
        "declaration": true,
        "outDir": "./lib",
        "noImplicitAny": true,
        "importHelpers": true
      },
      "include": [
        "src/**/*",
        "index.d.ts",   // declaration file path
      ],
      "compileOnSave": false
    }

- edit: tanda kutip yang diperlukan di sekitar nama modul

Saya memiliki masalah yang sama menggunakan modul simpul dengan aplikasi reaksi yang ditulis dalam naskah. Modul berhasil diinstal menggunakan npm i --save my-module. Itu ditulis dalam javascript dan mengekspor Clientkelas.

Dengan:

import * as MyModule from 'my-module';
let client: MyModule.Client = new MyModule.Client();

Kompilasi gagal dengan kesalahan:

Could not find a declaration file for module 'my-module'. 
'[...]/node_modules/my-module/lib/index.js' implicitly has an 'any' type.
  Try `npm install @types/my-module` if it exists or add a new declaration (.d.ts) file containing `declare module 'my-module';`

@types/my-moduletidak ada, jadi saya menambahkan my-module.d.tsfile di sebelah yang my-modulediimpor, dengan baris yang disarankan. Saya kemudian mendapatkan kesalahan:

Namespace '"my-module"' has no exported member 'Client'.

Klien sebenarnya diekspor dan berfungsi normal jika saya menggunakannya di aplikasi js. Juga, pesan sebelumnya memberi tahu saya bahwa kompiler mencari di file yang tepat ( /node_modules/my-module/lib/index.jsdidefinisikan dalam my-module/package.json "main"elemen).

Saya memecahkan masalah dengan mengatakan kepada kompiler saya tidak peduli tentang implisit any, yaitu, saya mengatur ke falsebaris berikut dari tsconfig.jsonfile:

    "noImplicitAny": false,

sederhana untuk memperbaiki Anda adalah:

// example.d.ts
declare module 'foo';

jika Anda ingin mendeklarasikan antarmuka objek (Merekomendasikan untuk proyek besar) Anda dapat menggunakan:

// example.d.ts
declare module 'foo'{
    // example
    export function getName(): string
}

Bagaimana cara menggunakannya? sederhana..

const x = require('foo') // or import x from 'foo'
x.getName() // intellisense can read this

Saya mendapatkan ini juga, membuat saya bingung untuk sementara waktu, bahkan dengan modul dan tipe yang sudah diinstal dan memuat ulang IDE saya beberapa kali.

Apa yang diperbaiki dalam kasus saya adalah menghentikan proses terminal, menghapus node_modules, menghapus cache manajer paket node dan melakukan yang baru installkemudian memuat ulang editor.

Sayangnya itu di luar tangan kami apakah penulis paket mengganggu dengan file deklarasi. Apa yang cenderung saya lakukan adalah memiliki file index.d.tsyang berisi semua file deklarasi yang hilang dari berbagai paket:

Index.ts:

declare module 'v-tooltip';
declare module 'parse5';
declare module 'emoji-mart-vue-fast';

Inilah yang berhasil membentuk saya.

npm install --save readline

Saya sudah mencoba semuanya di sini, tetapi bagi saya itu adalah masalah yang sama sekali berbeda: Saya harus menghapus dari *.d.tssemua pernyataan impor saya :

import { SomeModuleType } from '3rd-party-module';

Setelah menghapus kesalahan hilang ...

Klarifikasi : Ketika kami mendeklarasikan modul dalam *.d.tsfile, itu secara otomatis diambil oleh kompiler Typecript sebagai modul ambient (yang Anda tidak perlu mengimpor secara eksplisit). Setelah kita tentukan import ... from ..., file sekarang menjadi modul normal (ES6), dan karenanya tidak akan diambil secara otomatis. Karenanya jika Anda tetap ingin berperilaku sebagai modul ambient , gunakan gaya impor yang berbeda seperti:

type MyType: import('3rd-party-module').SomeModuleType;

Cukup Anda dapat mengimpornya menggunakan kode sebagai berikut:

var _ = require('your_module_name');