IntelliSense：为什么我无法查找 DOM/CSS 类型？

Question

尝试编写我的第一个 TypeScript 项目，编译器非常挑剔：

let test = <div style={{textAlign:'right'}}>Text</div>; // OK

let right = 'right';
let test2 = <div style={{textAlign:right}}>Text</div>; /***ERROR***
   Type '{ style: { textAlign: string; }; }' is not assignable to 
   type 'DetailedHTMLProps<HTMLAttributes<HTMLDivElement>, HTMLDivElement>'.
    Type '{ style: { textAlign: string; }; }' is not assignable to type 
    'HTMLAttributes<HTMLDivElement>'.
     Types of property 'style' are incompatible.
      Type '{ textAlign: string; }' is not assignable to type 'CSSProperties'.
       Types of property 'textAlign' are incompatible.
        Type 'string' is not assignable to type 'TextAlignProperty'.
*/

但是我无法使用 Ctrl+Shift+O（在 VSCode 中）查找诸如 TextAlignProperty 之类的类型。有没有办法让这个工作？

P.S。最终我发现类型是在 node_modules\csstype\index.d.ts 中定义的，我可以写

import * as CSS from 'csstype';
...
let right = 'right';
let test = <div style={{textAlign:right as CSS.TextAlignProperty}}>Text</div>;

但是有一个更简单的方法：

let right = 'right';
let test = <div style={{textAlign:right} as any}>Text</div>;

所以这里真正的问题是，如何在不知道定义它的模块名称的情况下查找某些东西？

Answer 1

一种方法，运行 Go to definition 在 textAlign 上 <div style={{textAlign:'right'}}>Text</div>;。这将打开显示预期类型的 d.ts 文件，然后您可以进一步深入研究：

或使用workspace symbol search直接按名称跳转到类型：

IntelliSense：为什么我无法查找 DOM/CSS 类型？

IntelliSense: Why can't I look up DOM/CSS types?

intellisense

typescript