TS9999 ":}" or ":{" expected

[avernikoz]

Hi, I am new to React-tslint, but I have a problem with tslint, that I can't resolve. Link to image Look at the code below:

const Span = styled.span``

const Label = styled.label``

const Checkbox = styled.input`
  display: none;

  & + ${Label} ${Span} {
    display: inline-block;

    width: 18px;
    height: 18px;

    cursor: pointer;
    vertical-align: middle;

    border: 1.5px solid #909294;
    border-radius: 3px;
    background-color: transparent;
  }

  & + ${Label}:hover ${Span} {
    border-color: #4ed8da;
  }

  &:checked + ${Label} ${Span} {
    border-color: #4ed8da;
    background-color: #4ed8da;
    background-image: url('https://image.flaticon.com/icons/png/128/447/447147.png');
    background-repeat: no-repeat;
    background-position: center;
    background-size: 14px;
  }
`

Tslint throws an error: TS9999:} expected or, in some places TS9999:{ expected

Is it problem with tslint or with styled-components? How to resolve it? Thanks in advance.

My config: "typescript": "^2.8.0-dev.20180302", "tslint": "^5.9.1", "tslint-react": "^3.5.1", "tslint-config-prettier": "^1.10.0", "tslint-config-standard": "^7.0.0", "tslint-plugin-prettier": "^1.3.0",

[jkillian]

This is an error from TypeScript, not from tslint-react. Your code seems fine to me though at a glance, it's possible your editor just got out of sync with your code