tsepen
@tsepen
Фронтенд разработчик React & Redux

Ошибка eslint в Webstorm?

Использую styled-components React, в webstorm ругается eslint на этот код

const Items = styled.div`
  position: relative;
  flex: 1;
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  grid-gap: 1rem;
  margin-top: 1rem;
  transition: 0.25s;

  @media ${(p) => p.theme.device.tablet} {
    grid-template-columns: repeat(3, 1fr);
  }

  @media ${(p) => p.theme.device.laptop} {
    grid-template-columns: ${(p) => (p.isOpenFilter ? 'repeat(4, 1fr)' : 'repeat(5, 1fr)')};
  }
`;


Ошибка на строке в медиа запросом
Warning:(114, 9) Property 'grid-template-columns' is allowed only in following media groups: visual

Что это и как пофиксить?
  • Вопрос задан
  • 54 просмотра
Решения вопроса 1
rockon404
@rockon404 Куратор тега React
Frontend Developer
ESLint тут не причем и это не ошибка, а warning. Это плагин styled-components или анализатор, который использует этот плагин в webstorm выкидывает предупреждение, так как у вас не явно объявлен медиа запрос и он не может сопоставить его тип. Предлагаю забить.
Ответ написан
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы