yaverm
@yaverm

Как устранить проблему WebpackError: TypeError: window.matchMedia is not a function?

Столкнулся проблемой при сборке проекта функция matchMedia не запускается для глобального объекта window. В проекте используется Gatsby / React. Есть кастомный хук на определенный ширине экрана срабатывает. Когда проект запущен все работает хорошо, а вот когда я собираю проект npm run build Webpack выдает ошибку. Как можно устранить эту ошибку ?

const useMedia = (query) => {
    const windowGlobal = typeof window !== 'undefined' && window
    const [matches, setMatches] = useState(windowGlobal.matchMedia(query).matches)
    useEffect(() => {
      const media = windowGlobal.matchMedia(query)
      if (media.matches !== matches) setMatches(media.matches)
      const listener = () => setMatches(media.matches)
      media.addEventListener('change', listener)
      return () => media.removeEventListener('change', listener)
    }, [matches, query])

    return matches
  }
  const match = useMedia('(max-width: 575px)')
  const changeLabel = match ? 'Cancel' : 'Add Now'
  • Вопрос задан
  • 114 просмотров
Пригласить эксперта
Ваш ответ на вопрос

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

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