[Bug] Stale virtual module contents upon ".writeModule"

[kettanaito]

• [x] I'd be willing to submit the fix

Describe the bug

I have a file system watcher (gatsby-page-utils). I derive a JSON from the file changes (addition/removal) of a given directory. I then use your plugin to write the contents of that JSON as a virtual module for my build.

The issue is that when a file is added/removed, although .writeModule is called with the right JSON, the value of the virtual module remains stale. Actually, I believe it remains the same as when the build was done. Nothing changes the value: working with files, changing the build's entrypoint.

To Reproduce

1. Checkout this pull request.
2. yarn install && yarn build
3. Run yarn reproduce. This will open a local dev server.
4. Open the DevTools, switch to "Console".
5. See the virtual module's contents (entry.js) in the console.
6. Try adding/removing *.js files in the examples/virtual-issue directory.
7. See the console outputting the same JSON.

You can observe the value of the serializedPages in the FileRouterPlugin plugin to see that .writeModule() call receives updated value.

Environment if relevant (please complete the following information):

• OS: MacOS Catalina 10.15.5
• Node version: v12.18.0
• Webpack version: 5.15.0

Additional context

I'm building a plugin that represents a given directory as a JSON, watches for changes, and exposes that JSON to your bundle. I'd love to use your plugin underneath to provide that JSON as a virtual module. Thank you for creating this plugin!

[kettanaito]

I'm expecting the .writeModule() method to update the virtual module's contents as mentioned in this article. I've also found this comment stating that the method should behave similarly to fs.writeFile, which would update the contents of the file.

[camoonke]

same problem in webpack5

[xwchris]

Have same problem, anyone resolved this?

[christopherjbaker]

I am also running into this. I've tried fixes mentioned in #128 and #68 to no avail. Has anybody looked deeper into this yet or had any luck?

[andersekdahl]

I've been having the same issue of everything working on build but nothing happens during watch mode.

I've been able to localize it to this line for webpack5: https://github.com/sysgears/webpack-virtual-modules/blob/c45595835906a201f9441a2f3c9d688f5689767c/src/index.ts#L165

All the uses of fileWatcher there should be fileWatcher.watcher. So fileWatcher.watcher.path and fileWatcher.watcher.directoryWatcher etc rather than fileWatcher.path and fileWatcher.directoryWatcher. After that the change event is propagated correctly and I can tell that watchpack signals an aggregated change event for the virtual modules.

However I'm still not getting any compiled output. It's as if webpack sees the event but decides that nothing has happened and skips outputting anything.

EDIT: After cowboy applying the fixes in this PR https://github.com/sysgears/webpack-virtual-modules/pull/128 the watch mode started to work for me with webpack 5.72.0.

[larixer]

Closing the issue as stale, please retest on latest webpack-virtual-modules and reopen with reproduction steps if the issue still exists.