VSCode中的折叠样式化的组件常量

时间:2019-11-23 06:55:19

标签: reactjs visual-studio-code next.js styled-components

我一直在NextJS / React中使用样式化组件,我喜欢它。通常,我将样式分成单独的js文件,但是由于我对React,prop,hook和context等语言还比较陌生,所以我经常发现需要将样式保留在组件文件中。我的问题是如何在VSCode中折叠以下代码:

const SomeStyledComponent = styled.div`
  height: 300px;
  width: 300px;
  ...
`;

这将大大简化我的编码工作。

谢谢

1 个答案:

答案 0 :(得分:1)

您可以使用indentation代码折叠策略。

// settings.json
{
//  ...other settings
    "editor.foldingStrategy": "indentation",
}

来自settings doc

  

控制用于计算折叠范围的策略。 auto使用特定于语言的折叠策略(如果有)。 indentation使用基于缩进的折叠策略。