如何引用由tsc的declaration属性生成的TypeScript .d.ts文件中的类型

Hey there! Let's walk through how to reference the types from your published .d.ts files in your TypeScript projects. Since you've already packaged and published your reusable code with the declaration files included, the process should be straightforward once you know the key steps:

1. Install the Package from Your TFS Registry #

First, make sure you've installed your reusable package in the project where you want to use the types. Since it's hosted on TFS 2017's private registry, confirm your npm is configured to access this registry (via a project-specific .npmrc or global settings), then run:

npm install your-package-name --save
# Use --save-dev if it's only needed for development

2. Let TypeScript Auto-Detect the Types #

TypeScript is built to automatically find .d.ts files from installed npm packages, as long as two conditions are met:

• Your package's package.json includes a types (or typings) field pointing to your main declaration file. For example:

  "types": "./dist/index.d.ts"
  

  If you didn't add this field yet, updating your package's package.json will help TypeScript locate the declarations faster.
• Your project's tsconfig.json uses node as the moduleResolution setting (this is the default for most modern TypeScript projects, so you probably don't need to change anything here).

3. Import and Use Types Directly #

Once the package is installed, you can reference the types just like you would with any public npm package. Here's an example:

// Import specific interfaces, types, or type aliases
import { UserProfile, ApiResponse } from 'your-package-name';

// Use the type in your code
const currentUser: UserProfile = {
  id: 123,
  name: 'Jane Doe',
  email: 'jane@example.com'
};

// Or use a function that returns a typed value
import { fetchUser } from 'your-package-name';

const userResponse = await fetchUser(123);
// TypeScript will automatically infer the ApiResponse<UserProfile> type from the .d.ts file

4. Troubleshooting If Types Aren't Detected #

If TypeScript isn't picking up the types, try these quick checks:

• Verify the .d.ts file exists in the installed package folder (look in node_modules/your-package-name to confirm it's alongside the compiled JavaScript).
• Make sure your project's tsconfig.json doesn't have skipLibCheck set to true (this skips type checking for external libraries, which would hide your package's types).
• If your package has nested .d.ts files, ensure they're either referenced in the main declaration file (via /// <reference path="./path/to/nested.d.ts" />) or included in the files/include array of your package's tsconfig.json during compilation.

5. Using Global Types (If Applicable) #

If your package exposes global types (less common for reusable packages, but possible), you can add a reference to the package's types in a globals.d.ts file in your project:

/// <reference types="your-package-name" />

This makes the global types available across your project without needing to import them explicitly.

内容的提问来源于stack exchange，提问作者Mohammed Yasin Shaikh