Rollup Cannot call "addWatchFile" after the build has finished. with manualChunks and build --watch

[eunakria]

Describe the bug

I am attempting to use Vite's filesystem watch functionality to dynamically rebuild the code I am working on in real time. In this case I prefer to use build --watch over dev as it allows me to test my software specifically in the context of its backend, which is not written for Node.

I specify manual chunks to Rollup, and expect that other downstream build tools handle it gracefully. Vite seems to modify the provided Rollup config before passing it onward, specifically inserting its own plugins before and after user-specified ones. In this case, the offending plugin appears to be vite:ensure-watch.

In most cases, vite:ensure-watch is a no-op, which is why I assume this went unnoticed for so long. It acts only on proxy paths (path/to/dep.js?proxy), such as CommonJS dependencies processed by @rollup/plugin-commonjs. In those cases, it attempts to explicitly call addWatchFile on the base path.

In my repro, I prescribe a simple CommonJS dependency that is resolved by Rollup. In my actual application, this is React, which is also loaded as a CommonJS module. Specifically, it gets tripped up trying to load node_modules/react/index.js?commonjs-entry while react is in its own chunk.

From what I can tell, this doesn't do anything in the best of cases? I would disable the plugin and move on if I could, but there doesn't appear to be any option. Commenting out the body of the plugin and making it a true no-op doesn't affect filesystem watch functionality. Is this a holdover from a fix for an upstream bug? I believe simply removing the plugin would be an adequate fix, although I would love to hear from the team about vite:ensure-watch's purpose.

Reproduction

https://stackblitz.com/edit/vitejs-vite-np1h8f

Steps to reproduce

1. npm i
2. npx vite build --watch

System Info

System:
    [snip]
  Binaries:
    Node: 19.3.0 - ~/.asdf/installs/nodejs/19.3.0/bin/node
    Yarn: 1.22.19 - ~/.asdf/installs/nodejs/19.3.0/bin/yarn
    npm: 9.4.2 - ~/.asdf/plugins/nodejs/shims/npm
  npmPackages:
    vite: ^4.3.8 => 4.3.8

Used Package Manager

npm

Logs

Click to expand!

$ npx vite build --watch
vite v4.3.8 building for production...

watching for file changes...

build started...
✓ 7 modules transformed.
[vite:ensure-watch] Could not load /home/euna/repro12/cjs-dep/index.js?commonjs-entry: Cannot call "addWatchFile" after the build has finished.

Validations

• Follow our Code of Conduct
• Read the Contributing Guidelines.
• Read the docs.
• Check that there isn't already an issue that reports the same bug to avoid creating a duplicate.
• Make sure this is a Vite issue and not a framework-specific issue. For example, if it's a Vue SFC related bug, it should likely be reported to vuejs/core instead.
• Check that this is a concrete bug. For Q&A open a GitHub Discussion or join our Discord Chat Server.
• The provided reproduction is a minimal reproducible example of the bug.

[stackblitz]

Start a new pull request in StackBlitz Codeflow.

• vitejs-vite-np1h8f (Open reproduction)

[bluwy]

vite:ensure-watch was added in #7132, so that imports like ./asset.svg?raw is also watched. I'm not sure if that was the best fix at hindsight. Maybe our asset plugin should call addWatchFile by itself, or have vite:ensure-watch only apply to Vite queries.

You can workaround this today by creating another plugin with a configResolved hook, which passes a ResolvedConfig that you can pry into it's plugins array and patch it there (e.g. remove the plugin, or patch its load hook)

[susnux]

Same here node_modules/core-js/index.js?commonjs-entry: Cannot call "addWatchFile" after the build has finished.

I was not able to patch the load function, but removing the plugin works (still would be nice to have it fixed instead):

{
        name: 'remove-ensure-watch-plugin',
        enforce: 'post',
        configResolved: (config) => {
                // https://github.com/vitejs/vite/issues/13342
                config.plugins = config.plugins.filter(p => p?.name !== 'vite:ensure-watch')
        },
}