WebStorm 2020.3 - 如何启用 React 道具智能感知？

Question

我正在研究 React 项目，WebStorm 是我的 IDE 但我注意到，每当我想为我的组件编写一些道具时，我都没有得到正确的智能感知。 我使用 Create React-App和React-CSS-Modules作为样式库。

复选框组件：

const CheckboxWrapperInner = ({
  isSelected,
  customStyleName = 'checkbox',
  hex6Color = '#221ecc',
  additionalSelectedStyles = {
    borderColor: hex6Color || '#221ecc',
  },
  additionalUnselectedStyles = {
    backgroundColor: 'transparent',
  },
  label,
  onClick = () => {},
}) 

// ... some code

const CheckboxInner = ({...rest}) => {
  return <CheckboxWrapper customStyleName="checkbox" {...rest}></CheckboxWrapper>;
};

const CheckboxWrapper = CSSModules(CheckboxWrapperInner, style, {
  allowMultiple: true,
  handleNotFoundStyleName: 'ignore',
});
export const Checkbox = CSSModules(CheckboxInner, style, {allowMultiple: true});

Answer 1

道具完成不适用于具有 HOC 的组件（例如export default withStyles(styles)(MyComponent)等）。 并且每个 HOC 都需要添加一个特殊的支持。 相关票证： WEB-38369 , WEB-47862