[typescript] 모듈 ‘module-name’에 대한 선언 파일을 찾을 수 없습니다. ‘/path/to/module-name.js’에는 암시 적으로 ‘any’유형이 있습니다.

Program / 글쓴이

TypeScript 모듈 확인 방법을 읽었습니다 .

@ ts-stack / di 저장소가 있습니다. 디렉토리 구조를 컴파일 한 후 다음과 같습니다.

├── 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

내 package.json에서 나는 썼다 "main": "dist/index.js".

Node.js에서는 모든 것이 잘 작동하지만 TypeScript는 다음과 같습니다.

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

모듈 ‘@ ts-stack / di’에 대한 선언 파일을 찾을 수 없습니다. ‘/path/to/node_modules/@ts-stack/di/dist/index.js’에는 암시 적으로 ‘any’유형이 있습니다.

그러나 다음과 같이 가져 오면 모든 것이 작동합니다.

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

내가 뭘 잘못하고 있죠?

답변

다른 두 가지 해결책이 있습니다.

모듈이 아닌 경우- @types다음 에서 유형을 설치하십시오 .

npm install -D @types/module-name

위의 설치 오류가 발생하면 import명령문을 require다음 과 같이 변경하십시오 .

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

답변

'foo'라이브러리 자체 또는 @types/foo패키지 ( DefinitelyTyped 리포지토리 에서 생성 된)에서 입력을 제공하지 않는 타사 모듈 을 가져 오는 경우 모듈 을 선언하여이 오류를 해결할 수 있습니다. .d.ts확장자를 가진 파일 . TypeScript는 .d.ts파일의 .ts“files”, “include”및 “exclude”에 지정된 일반 파일 과 동일한 위치에서 파일을 찾습니다 tsconfig.json.

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

그런 다음 가져올 때로 foo입력됩니다 any.

또는 직접 입력을 롤링하려면 다음을 수행하십시오.

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

그런 다음 올바르게 컴파일됩니다.

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

실제로 사용하고있는 비트에 대해서만 모듈에 대한 완전한 타이핑을 제공 할 필요가 없으므로, 상당히 적은 양의 API를 사용하는 경우 특히 쉽습니다.

반면에 외부 라이브러리의 입력에 신경 쓰지 않고 입력하지 않은 모든 라이브러리를로 가져 오려면 확장명 any을 가진 파일에 이것을 추가 할 수 있습니다 .d.ts.

declare module '*';

이것의 장점 (및 단점)은 절대적으로 아무것도 가져올 수 있고 TS가 컴파일한다는 것입니다.

답변

빠른 수정이 필요한 경우 가져 오기 행 앞에 간단히 추가하십시오.

// @ts-ignore

답변

바로 제거 : 당신이 이틀 동안 찾고과 같이 그것을 발견 할 때 느끼는 그 .js에서 "main": "dist/index.js"의 package.json모든 것이 잘 작동합니다!

"main": "dist/index",

UPD :이 대답은 npm 패키지가있는 경우에 상대적인 것입니다 .

위의 대답은 수입 모듈을 해결되지 않을 경우에, 다만 추가 시도 typings에서 package.json:

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

물론 여기 폴더 dist-모듈의 파일을 저장하는 곳입니다.

답변

TypeScript는 기본적으로 규칙을 구현하고 코드에 유형을 추가하여 Javascript의 제약 조건이 없기 때문에보다 명확하고 정확하게 작성합니다. TypeScript에서는 컴파일러가 코드를 확인하고 오류를 찾을 수 있도록 데이터를 설명해야합니다. 범위를 벗어 났거나 다른 유형을 반환하려고하면 컴파일러에서 일치하지 않는 유형을 사용하고 있는지 알려줍니다. 따라서 TypeScript와 함께 외부 라이브러리 및 모듈을 사용하는 경우 해당 코드의 유형을 설명하는 파일이 포함되어 있어야합니다. 이러한 파일을 확장자가있는 형식 선언 파일 이라고 합니다d.ts . npm 모듈에 대한 대부분의 선언 유형은 이미 작성되었으며 다음을 사용하여 포함 할 수 있습니다 npm install @types/module_name(여기서 module_name은 유형을 포함하려는 모듈의 이름입니다).

그러나, 그들의 유형 정의를 가지고 오류를 확인하기 위해 멀리 가서 사용하여 모듈을 수입하지 않는 모듈이있다 import * as module_name from 'module-name', 폴더를 만들고 typings프로젝트의 루트에, 내부 모듈의 이름으로하고 있다는 점에서 새 폴더를 만들 수는 폴더는 module_name.d.ts파일을 작성하고 씁니다 declare module 'module_name'. 그런 다음 tsconfig.json파일 로 이동 "typeRoots": [ "../../typings", "../../node_modules/@types"]하여 compilerOptions(폴더의 적절한 상대 경로와 함께) 라이브러리에 추가하여 라이브러리 및 모듈의 유형 정의를 찾고 "exclude": ["../../node_modules", "../../typings"]파일에 새 속성 을 추가 할 수있는 위치를 TypeScript에 알립니다 . 다음은 tsconfig.json 파일의 모양에 대한 예입니다.

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

이렇게하면 오류가 사라지고 최신 ES6 및 TypeScript 규칙을 고수 할 수 있습니다.

답변

다른 사람이 이것을 읽으려면 .js 파일의 이름을 .ts로 바꾸십시오.

편집 : "allowJs": truetsconfig 파일에 추가 할 수도 있습니다 .

답변

이 방법은 저에게 효과적입니다.

1. index.d.ts와 같은 선언 파일에 자신의 선언을 추가하십시오 (프로젝트 루트 아래에있을 수 있음)

declare module 'Injector';

2. index.d.ts를 tsconfig.json에 추가하십시오.

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

-편집 : 모듈 이름 주위에 필요한 따옴표