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的{​​{1}}上运行textAlign。这将打开显示预期类型的​​d.ts文件，然后您可以进一步深入研究：

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