Skip to content

Refresh not working on entries using a layer #867

Open

Description

@richterb

On my current setup, the entire HMR + refresh works fine on an entry such as:

myentry: {
    import: './src/entries/myentry.tsx',
},

But if I configured it to use a layer such as:

myentry: {
    import: './src/entries/myentry.tsx',
    layer: 'mylayer',
},

The entire HMR system works, detects the right file, but refresh doesn't happen.

I don't know if this is relevant or not, but the main difference may be in the way the updated module is identified:

[HMR] Updated modules:
[HMR] - (mylayer)/./src/applications/myapp/myfile.tsx

When a layer is configured, (mylayer)/ is appended at the start of the path in the log, and I can see this as well at the start of the JS file sent to the browser:

self["webpackHotUpdatereactjs"]("myentry", {

    /***/
    "(mylayer)/./src/applications/myapp/myfile.tsx": /*!**************************************************************************!*\

I'm not familiar enough with the mechanisms, but maybe it's messing with path comparison somewhere down the road.

I can reproduce this on a fresh app created using create-react-app, ejected so that the webpack config uses a layer on its entry (+ latest versions of webpack, webpack-dev-server, and react-refresh-webpack-plugin).

Layers are a Webpack experiment so this may be a bit of an edge case. Thanks!

Activity

  1. moonlitusun commented on Oct 16, 2024

    @moonlitusun

    +1

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Projects

    No projects

      Milestone

      No milestone

      Relationships

      None yet

      Development

      No branches or pull requests

      Issue actions