Hot reloading refreshes page but does not propagate changes

[mririgoyen]

This a 🐛 bug report.

I have several .jsx files. When these are updated, the site reloads with the changes applied.

However, these .jsx files also have imports of CommonJS .js modules. When these files are changed, the browser auto-refreshes like with the .jsx files, however the changes do not take effect. Manually refreshing the browser causes the changes to take effect.

These CommonJS files are imported using the module-resolver plugin and are stored in the "modules" folder at the root level (so next to the "node_modules" folder).

🎛 Configuration (.babelrc, package.json, cli command)

{
  "presets": [
    "env",
    "react",
    "stage-3"
  ],
  "env": {
    "test": {
      "plugins": [
        "rewire"
      ]
    }
  },
  "plugins": [
    [
      "module-resolver",
      {
        "root": [
          "./",
          "./components",
          "../modules",
          "../node_modules"
        ],
        "alias": {
          "assets": "./assets",
          "style": "./style"
        }
      }
    ],
    "transform-class-properties"
  ]
}

🤔 Expected Behavior

When a change is made and saved to an imported CommonJS file, the hot reload should happen with the changes in effect.

😯 Current Behavior

When a change is made and save to an imported CommonJS file, the hot reload appears to happen, but the changes are not in effect. A hard reload of the browser causes the changes to take effect.

💁 Possible Solution

¯\(ツ)/¯

🔦 Context

We store most of our major logic in very small functions in libraries and leave the .jsx files to be the view layer only. Since we do most of our main logic changes in these imported files, the fact that they require a hard reload on every change makes the development very cumbersome and annoying.

🌍 Your Environment

Software	Version(s)
Parcel	1.8.1
Node	10.1.0
npm/Yarn	1.6.0
Operating System	macOS

[dobesv]

Do the filenames change ? Maybe the js file is cached in the browser.

[mririgoyen]

@dobesv I doubt this is the issue. The files are imported inside the JSX file and there is no code splitting happening, so they should be part of the Parcel's bundled output file.

Additionally, when developing, the DevTools panel is open with the "Disable cache (while DevTools is open)" options on.

[mririgoyen]

Upon further investigation, I have ruled out chokidar as being the cause for this. Chokidar IS detecting the file change, this is what causes the reload to happen. Parcel is just not recognizing the change to cause a recompile of the affected files.

[mischnic]

Do you still have this issue? You haven't posted any details regarding your code, so a reproduction would be great.

[mririgoyen]

We stopped using Parcel and went to a more stable package bundler.