Làm thế nào để sử dụng các mô-đun npm từ bảng chữ?


90

Tôi đang thử đánh máy. Nó hoạt động tốt ở giai đoạn chào thế giới. Bây giờ tôi đang cố gắng sử dụng mô-đun npm:

index.ts =

import _ = require('lodash')

console.log(_.toUpper('Hello, world !'))

Điều này không hoạt động:

  • tsc index.ts -> Cannot find module 'lodash'. (2307)
  • node-ts index.js -> Cannot find module 'lodash'. (2307)

Nhìn vào tài liệu sắp chữ và trong google không giúp được gì. Các câu hỏi S / O khác hoặc không được trả lời ( ở đâyở đây ) hoặc không liên quan.

Các yếu tố:

  • typecript 1.8 mới nhất
  • Có, lodash đã được cài đặt npm i --save lodashvà tồn tại trong hệ thống tệp của tôi (đã chọn)
  • Tôi cũng đã làm typings i --save lodash
  • biến thể import * as _ from 'lodash'hoặc const _ = require('lodash')không hoạt động
  • Tôi đã thử điều chỉnh các tùy chọn tsconfig.json như được đề xuất trong các câu trả lời khác "moduleResolution": "node""module": "commonjs"như được đề xuất trong một số câu trả lời, vẫn không hoạt động

Làm thế nào để chúng ta sử dụng một gói npm trong bảng chữ ??


2
Bạn đã thêm tham chiếu đến lodash.d.ts trong index.ts của mình chưa? Nó sẽ trông giống như sau: ///<reference path="../typings/lodash/lodash.d.ts"/>
Granga

@Granga Nó hoạt động. Bạn có thể thêm điều này như một câu trả lời?
Offirmo

2
Rất vui vì nó hoạt động. Blackus đã thêm câu trả lời và nó chỉ định những gì tôi đề xuất thậm chí còn tốt hơn. Tuy nhiên, có một lưu ý: Khi các tệp đầu vào được chỉ định trên dòng lệnh (đó là trường hợp của bạn), các tệp tsconfig.json sẽ bị bỏ qua. ( nguồn )
Granga

Câu trả lời:


61

[EDIT] Cảm ơn rất nhiều vì câu trả lời này! Tuy nhiên, tính đến năm 2018, nó đã lỗi thời. Độc giả, hãy xem các câu trả lời khác.

Có một số cách để nhập mô-đun từ npm. Nhưng nếu bạn không nhận được các bản đánh máy, tscbạn sẽ luôn phàn nàn rằng nó không thể tìm thấy mô-đun bạn đang yêu cầu (ngay cả khi js chuyển đổi thực sự đang hoạt động).

  • Nếu bạn có cách đánh máy và không sử dụng a tsconfig.json, hãy sử dụng referenceđể nhập các kiểu chữ:

    /// <reference path="path/to/typings/typings.d.ts" />
    
    import * as _ from 'lodash`;
    
    console.log(_.toUpper('Hello, world !'))
    
  • Nếu bạn đang sử dụng một tsconfig.jsontệp, hãy đảm bảo có tệp đánh máy của bạn được bao gồm (hoặc không bị loại trừ, tùy chọn của bạn) và thực hiện importgiống như trong ví dụ trước.

Trong trường hợp không có sẵn bản đánh máy. Bạn có hai lựa chọn: viết của riêng bạn trên một .d.tstệp, hoặc bỏ qua việc kiểm tra loại cho thư viện.

Để hoàn toàn bỏ qua việc kiểm tra kiểu (đây không phải là cách được khuyến nghị), hãy nhập thư viện trên một biến kiểu any.

 const _: any = require('lodash');

 console.log(_.toUpper('Hello, world !'))

tscsẽ phàn nàn rằng requirekhông tồn tại. Cung cấp các cách đánh máy nodehoặc declarenó để loại bỏ lỗi.


2
Hoàn thành câu trả lời với 3 giải pháp. +1
Offirmo

Ngoài ra: nó thậm chí làm việc với ts-nodechừng chỉ số typings được tham chiếu trongtsconfig.json
Offirmo

Tôi bối rối với ý của bạn là "khai báo để loại bỏ lỗi." Tôi có cần thực hiện thay đổi này trong mô-đun mà tôi đang cố gắng nhập không?
Slug

1
Câu trả lời này đã lỗi thời nghiêm trọng. Xem câu trả lời mới của tôi bên dưới stackoverflow.com/a/53786892/587407
Offirmo

50

[2018/12] Câu trả lời mới, cập nhật cho câu hỏi này mà tôi đã hỏi vào năm 2016, câu trả lời vẫn cho thấy rất nhiều hoạt động mặc dù có câu trả lời đã lỗi thời.

Tóm lại, TypeScript yêu cầu thông tin kiểu về mã gói của bạn (còn gọi là " tệp khai báo kiểu " hay còn gọi là " kiểu đánh máy ") và nói một cách chính xác rằng bạn sẽ mất toàn bộ điểm của TypeScript. Có một số giải pháp để cung cấp hoặc chọn không tham gia, được liệt kê ở đây theo thứ tự thực tiễn tốt nhất:


Giải pháp 0 : mô-đun đã cung cấp các kiểu đánh máy. Nếu package.json của nó chứa một dòng như thế này:

"typings": "dist/index.d.ts",

nó đã được kích hoạt TypeScript. Rất có thể sẽ không đúng nếu bạn đang đọc trang này, vì vậy hãy tiếp tục ...


Giải pháp 1 : Sử dụng typings cộng đồng đóng góp từ DefinitelyTyped . Đối với mô-đun "foo", hãy thử điều này:

npm add -D @types/foo

nếu nó hoạt động, jackpot! Bây giờ bạn có các cách đánh máy và có thể sử dụng mô-đun của mình. Nếu npm phàn nàn rằng nó không thể tìm thấy mô-đun @ type / foo, hãy tiếp tục ...


Giải pháp 2 : cung cấp các kiểu đánh máy tùy chỉnh về mô-đun này. (với một tùy chọn để không nỗ lực)

  1. Tạo một thư mục có tên "typings-custom" ở thư mục gốc của dự án của bạn
  2. Tham khảo nội dung của thư mục này trong tsconfig.json của bạn:
"include": [
    "./typings-custom/**/*.ts"
]
  1. Tạo một tệp với tên chính xác này: foo.d.ts [foo = tên của mô-đun] với nội dung:
declare module 'foo'

Mã TypeScript của bạn bây giờ sẽ được biên dịch, mặc dù KHÔNG có thông tin về loại (TypeScript coi mô-đun foo thuộc loại "bất kỳ").

Bạn cũng có thể cố gắng tự mình viết thông tin loại, xem tài liệu chính thức và / hoặc xem các ví dụ từ Chắc chắnTyped . Nếu bạn làm vậy, hãy nghĩ đến việc đóng góp các cách đánh máy của bạn trực tiếp vào mô-đun (giải pháp 0, nếu tác giả mô-đun chấp nhận) hoặc vào DefiniedlyTyped (giải pháp 1)


1
@Offirmo, Chúng tôi cũng có thể khai báo nhiều kiểu chữ tùy chỉnh trong một tệp duy nhất! Vì vậy, không cần nhiều tệp (Có thể?).
lazycipher

Bước 2. Reference the content of this folder in your tsconfig.json:đưa ra lỗi sau: Unknown compiler option 'include'.
Sumit

1
@Sumit nó không phải là một lựa chọn trình biên dịch, nó phải là một anh chị em ruột củacompilerOptions
Offirmo

22

Có thể bạn đang thiếu Tệp khai báo .

Xem Chắc chắn đã gõ để biết thêm thông tin.


Thử đi:

npm install --save lodash
npm install --save @types/lodash

Bây giờ bạn có thể nhập.

import _ from 'lodash';

Nếu mô-đun bạn đang nhập có nhiều lần xuất , bạn có thể thực hiện việc này:

import { Express, Router } from 'express';

Nếu mô-đun bạn đang nhập "không có xuất mặc định", bạn cần thực hiện việc này:

import * as http from 'http';

Tại sao chúng ta phải sử dụng * as _và không chỉ _ from 'lodash'như trong mã ES6?
JohnnyQ

@JohnnyQ Điểm tốt. Sử dụng import _ from 'lodash';là tốt hơn trong trường hợp này. Tôi đã cập nhật câu trả lời của mình để hiển thị các cách nhập khác nhau và lý do bạn sử dụng chúng.
Derek Soike

1
Các * as _ là cần thiết nếu các mô-đun không có xuất khẩu mặc định. Trình biên dịch tsc sẽ cảnh báo điều này.
user2867342

Bằng cách 'không xuất mặc định', điều đó có nghĩa là không có loại chỉ định loại nào được xác định (tức là nhập một mô-đun JavaScript thuần túy)? Tôi mới sử dụng JS / Typescript ....
Big Rich

2
@BigRich "Không xuất mặc định" có nghĩa là mô-đun không có export default <...>câu lệnh. Hãy xem phần "Xuất mặc định" của Tài liệu Mô-đun Typecript .
Derek Soike

4

Nó đã làm việc cho tôi.

  1. Tạo một thư mục có tên "typings".
  2. Trong thư mục đánh máy, hãy tạo một tên tệp module-name.d.ts . Nó chứa:

    declare module "module-name";

  3. Trong tsconfig.json, hãy tham khảo thư mục

    "typeRoots": [ "./typings", "../node_modules/@types" ]


Chào! Cảm ơn vì đã đóng góp. Phương pháp này đã được bao gồm trong câu trả lời của tôi và chỉ nên được sử dụng như một phương sách cuối cùng.
Offirmo

Bước 3 In tsconfig.json, refer to the folder:, đưa ra lỗi sau:Unknown compiler option 'typesRoots'.
Sumit

1
@Sumit trong trường hợp của tôi, "typesRoots" là bên trong "compilerOptions"
Quỳnh Ngô

1
Đó là typeRoots không phải typeRoots và phải nằm trong trình biên dịchOptions
CM

0

Tôi đã gặp lỗi này và không có câu trả lời nào phù hợp với tôi nhưng tôi đã tìm ra điều gì đó khi bạn muốn làm việc với mô-đun nút trong tập lệnh, hãy cài đặt chúng dưới dạng

$npm install @types/<module_name>

ví dụ

npm install @types/cheerio

thay vì nói

npm install cheerio
Khi sử dụng trang web của chúng tôi, bạn xác nhận rằng bạn đã đọc và hiểu Chính sách cookieChính sách bảo mật của chúng tôi.
Licensed under cc by-sa 3.0 with attribution required.