Typescript не может найти тип в файле определения в папке node_modules

Question

У меня есть проект с такой структурой:

project/
├── package.config
├── node_modules/
│   ├── interactjs/
│   ├── ├── index.d.ts
├── src/
│   ├── browser/
│   |   ├── tsconfig.json
│   |   ├── index.ts

У меня есть следующее ./package.json:

{
    ...
    "dependencies": {
        "interactjs": "1.3.4"
    },
    "devDependencies": {
        "typescript": "3.2.2"
    }
}

Мой ./src/browser/tsconfig.json:

{
    "compilerOptions": {
        "target": "es5",
        "module": "none",
        "declaration": true,
        "strict": true,
        "strictNullChecks": false,
        "outDir": "./out"
    },
    "typeRoots": [
        "../../node_modules",
        "../../node_modules/@types",
        "../definitions"
    ],
    "include": [
        "./**/*"
    ]
}

Как вы можете видеть, я включаю также папку definitions, так как есть некоторые ручные определения, которые я хочу включить во все файлы Typescript моего проекта.

Проблема

Следующая компиляция не удалась:

const p : interact.Position = { x: 1, y: 2 };

С ошибкой:

index.ts:9:11 - error TS2503: Cannot find namespace 'interact'.

9 const s : interact.Position = { x: 1, y: 2 };
            ~~~~~~~~

interact не найден, хотя в node_modules/interactjs файл index.d.ts присутствует со всеми определениями.

В чем проблема?

Answer 1

При импорте пакета Typescript (и Node) определите, какой файл / модуль следует импортировать из этого пакета, ища поле main в файле package.json, включенном в пакет.Файл package.json в interactivejs включает в себя следующую строку:

"main": "dist/interact.js",

Это означает, что основной модуль в пакете interactivejs имеет имя interact.js и находится в каталоге dist/.

Если файл package.json пакета не указывает явно местоположение файла определения типа, Typescript будет предполагать, что файл определения типа имеет то же базовое имя и расположение, что и основной модуль пакета.Учитывая расположение основного модуля в interactivejs, Typescript будет искать определения типов в файле dist/interact.d.ts.Попробуйте переименовать файл определения типа из index.d.ts в interact.d.ts и убедитесь, что он находится в каталоге dist/.

Если вы создаете пакет, содержащий определения Typescript, полезно сделатьместоположение файла определения, явное путем включения поля types в поле package.json, как описано в руководстве по публикации

Answer 2

Если вы хотите сохранить разрешение модуля равным нулю, добавление файла ввода в раздел "include" должно дать вам желаемый результат.

tsconfig.json

{
    "compilerOptions": {
        "target": "es5",
        "module": "none",
        "declaration": true,
        "strict": true,
        "strictNullChecks": false,
        "outDir": "./out",
        "noImplicitAny": false //<------ to ignore the errors in interactjs/index.d.ts
    },
    "typeRoots": [
        "../../node_modules",
        "../../node_modules/@types",
        "../definitions"
    ],
    "include": [
        "../../node_modules/interactjs/index.d.ts", //<----- include interact in the global scope
        "./**/*"
    ]
}

index.ts

const p : interact.Position = { x: 1, y: 2 };
const s : interact.SnapPosition = { x: 1, y: 2, range: 0 };

const listener : interact.Listener = (e: interact.InteractEvent)=>{
    console.log(e);
};

interact.on("cancel", listener)

встроенный index.js

"use strict";
var p = { x: 1, y: 2 };
var s = { x: 1, y: 2, range: 0 };
var listener = function (e) {
    console.log(e);
};
interact.on("cancel", listener);

Answer 3

Похоже, вам не хватает строки "moduleResolution":"node", в вашем файле tsconfig.json.

Так выглядит один из моих файлов tsconfig.json.

{
  "compileOnSave": false,
  "compilerOptions": {
  "baseUrl": "./",
  "outDir": "./dist/out-tsc",
  "sourceMap": true,
  "declaration": false,
  "module": "es2015",
  "moduleResolution": "node",
  "emitDecoratorMetadata": true,
  "experimentalDecorators": true,
  "target": "es5",
  "typeRoots": [
    "node_modules/@types"
  ],
  "lib": [
    "es2017",
    "dom"
   ]
  }
}