在JSX中编写时,Intellicode在Vs代码中无法正常工作

时间:2020-07-24 15:37:51

标签: reactjs visual-studio-code

我是新来的人,我正在实现一个名为 styled-components 的第三方程序包,以便与我的应用程序中的CSS样式一起使用

使用 styled-components 包需要我编写通常包含CSS和javascript(混合)的代码。

例如

//para style
const StyledPara = styled.p`
  color: green;

  @media (max-width: 500px) {
    color: red;
    font-weight: bold;
    font-size: 40px;
  }
`;

//div style

const StyledDiv = styled.div`
  width: 400px;
  margin: 16px auto;
  border: 1px solid #eee;
  box-shadow: 0 2px 3px #ccc;
  padding: 40px;
`;

**//Button style**

const ButtonStyle = styled.button`
  padding: 8px;
  font: inherit;
  border: 2px solid black;
  cursor: pointer;
  background: ${(props) => (props.colorInfo ? "red" : "green")};
  color: white;
  &:hover {
    background-color: ${(props) =>
      props.colorInfo ? "#ffcccb" : "lightgreen"};
  }
`;

每当我在JSX中编写诸如媒体查询等CSS样式时,我都无法在VS代码编辑器中获得自动完成建议。

有什么办法可以解决这个问题?任何帮助,将不胜感激。谢谢

0 个答案:

没有答案