"Unresolved function or method" on basic styled.h2 code

[griffico]

• IDE name and version: Webstorm 2019.2.4
• Styled-components plugin version: 1.0.11

Problem description:

Webstorm tells me that h2 is an unresolved method or function, even though it works just fine. Not even sure this is a plugin issue, but obviously it's not unresolved since the code works; Webstorm just doesn't know what the tag is. Not specific to h2 tags, either.

import React from "react"
import styled from 'styled-components';
import {lightBlue, seafoamGreen} from "../Constants";

const PostHeader = styled.h2`
        background-color: white;
        padding: 0.5rem;
        color: black;
        border: solid 5px;
        border-image: linear-gradient(to bottom right, ${lightBlue} 0%, ${seafoamGreen} 100%);
        border-image-slice: 1;

[undeadcat]

@griffico, Issues about 'unresolved function' should be addressed on the WebStorm side. This plugin only controls highlighting within strings, resolving JS functions is done on the IDE side.

Is this code snippet JavaScript or TypeScript? Have you tried adding @types/react and @types/styled-components to your project? Usually having typings helps the IDE resolve definitions.

In any case, I think you should report this to the WebStorm issue tracker: https://youtrack.jetbrains.com/issues?q=%23WEB