Improve config change handling #12319
Conversation
🦋 Changeset detectedLatest commit: 7a6ffb8 The changes in this PR will be included in the next version bump. This PR includes changesets to release 11 packages
Not sure what this means? Click here to learn what changesets are. Click here if you're a maintainer who wants to add another changeset to this PR |
| } | ||
| let configCodeChanged = | ||
| configFileAddedOrRemoved || | ||
| (typeof reactRouterConfigFile === "string" && |
There was a problem hiding this comment.
Use Boolean or !== undefined.
| let message = (() => { | ||
| if (configChanged) return "Config changed."; | ||
| if (routeConfigChanged) return "Route config changed."; | ||
| if (configCodeChanged) return "Config saved."; | ||
| if (routeConfigCodeChanged) return "Route config saved."; | ||
| return "Config saved."; | ||
| })(); |
There was a problem hiding this comment.
Couldn't help myself, had to see how this looked as a nested ternary
| let message = (() => { | |
| if (configChanged) return "Config changed."; | |
| if (routeConfigChanged) return "Route config changed."; | |
| if (configCodeChanged) return "Config saved."; | |
| if (routeConfigCodeChanged) return "Route config saved."; | |
| return "Config saved."; | |
| })(); | |
| // prettier-ignore | |
| let message = | |
| configChanged ? "Config changed." : | |
| routeConfigChanged ? "Route config changed." : | |
| configCodeChanged ? "Config saved." : | |
| routeConfigCodeChanged ? "Route config saved." : | |
| "Config saved."; |
Feel free to leave as is if you prefer, but I do like the ternary form better / less ceremony
| !dirname.startsWith(appDirectory) && | ||
| // Ensure we're only watching files outside of the app directory | ||
| // that are at the root level, not nested in subdirectories | ||
| path !== root && // Watch the root directory itself | ||
| dirname !== root // Watch files at the root level |
There was a problem hiding this comment.
Ideally, we could watch the root for only changes to <root>/react-router.config.ts (and its module graph) and the corresponding app directory, rather than coarse-grained allowlist for any file in the root. But that's not a blocker.
There was a problem hiding this comment.
Actually, I think this would be relatively easy to do with Vite Node's .devserver.watcher.on
Note, this is some minor polish that can go out after the initial v7.0.0 release.
This makes the following improvements to
react-router.config.tschange handling while the dev server / typegen watch is running:react-router.config.tsis created or deleted.appDirectoryand updates the file watcher, unwatching the old directory and watching the new one.