gatsby: Hot reload does not work with linaria

Description

Hot reload does not work with https://github.com/callstack/linaria since 2.24.9

Related issues:

Steps to reproduce

Demo project: https://github.com/hartshorne/hot-reload-repro

Using a linaria class, like https://github.com/hartshorne/hot-reload-repro/blob/master/src/pages/index.js:

import React from "react"
import { Link } from "gatsby"

import { css } from "linaria"

import Layout from "../components/layout"
import Image from "../components/image"
import SEO from "../components/seo"

const styles = {
  superClass: css`
    color: red;
  `,
}

const IndexPage = () => (
  <Layout>
    <SEO title="Home" />
    <h1 className={styles.superClass}>Hi people</h1>
    <p>Welcome to your new Gatsby site.</p>
    <p>Now go build something great.</p>
    <div style={{ maxWidth: `300px`, marginBottom: `1.45rem` }}>
      <Image />
    </div>
    <Link to="/page-2/">Go to page 2</Link> <br />
    <Link to="/using-typescript/">Go to "Using TypeScript"</Link>
  </Layout>
)

export default IndexPage

Expected result

Hot reload should work.

Actual result

Hot reload does not work.

Environment

% ./node_modules/.bin/gatsby info --clipboard                                                                                                                         (git)-[master] 

  System:
    OS: macOS 10.15.7
    CPU: (56) x64 Intel(R) Xeon(R) W-3275M CPU @ 2.50GHz
    Shell: 5.7.1 - /bin/zsh
  Binaries:
    Node: 14.14.0 - /usr/local/bin/node
    Yarn: 1.22.10 - /usr/local/bin/yarn
    npm: 6.14.8 - /usr/local/bin/npm
  Languages:
    Python: 3.8.3 - /usr/local/Caskroom/miniconda/base/bin/python
  Browsers:
    Chrome: 86.0.4240.111
    Firefox: 80.0.1
    Safari: 14.0
  npmPackages:
    gatsby: ^2.24.85 => 2.24.85
    gatsby-image: ^2.4.21 => 2.4.21
    gatsby-plugin-linaria: ^2.1.0 => 2.1.0
    gatsby-plugin-manifest: ^2.4.35 => 2.4.35
    gatsby-plugin-offline: ^3.2.37 => 3.2.37
    gatsby-plugin-react-helmet: ^3.3.14 => 3.3.14
    gatsby-plugin-sharp: ^2.6.43 => 2.6.43
    gatsby-source-filesystem: ^2.3.35 => 2.3.35
    gatsby-transformer-sharp: ^2.5.19 => 2.5.19

About this issue

  • Original URL
  • State: closed
  • Created 4 years ago
  • Reactions: 2
  • Comments: 18 (13 by maintainers)

Most upvoted comments

Sorry for the late reply - it just requires some time and prioritization. It is still about webpack watching suspend and resume coordination.

Just needs more debugging to find another cause (there were apparently several distinct causes).