打字稿未选取环境定义文件

Question

I am creating this sandbox and in ./src/components/tree/index.tsx I have this code:

/// <reference path="./Tree.d.ts" />

export const Tree: React.FunctionComponent<TreeProps> = ({

And in Tree.d.ts I have the interface definition:

export interface TreeProps<Datum, LinkComponentType, NodeComponentType> {
  top?: number;
  left?: number;

But tsc is complaining:

Cannot find name 'TreeProps'.ts(2304) Exported variable 'Tree' has or is using private name 'TreeProps'.ts(4025)

Answer 1

You forgot to import the interface TreeProps from your file.

Just add the following line in your src/components/Tree/index.tsx

import {TreeProps} from './Tree'

You also need to pass arguments to the Tree props

---

Here are a few things I would like you to know, maybe you already know some things here.

1. The declaration file for the module in file abc.js should be in abc.d.ts, the file name should be same and should be in the same directory, or you have to explicitly add declare module in your declaration file.

2. Declaration files are used to tell the types of the javascript modules , so when you're writing typescript, you don't need to add .d.ts file, tsc will auto-generate .js and corresponding .d.ts files.