docs(plugin): add watch mode plugin example with modifiedFiles and fileDependencies#8125
Conversation
|
The latest updates on your projects. Learn more about Vercel for GitHub.
|
| const templatePath = path.resolve(__dirname, "my-template.html"); | ||
|
|
||
| // Ensure webpack watches this file | ||
| compilation.fileDependencies.add(templatePath); |
There was a problem hiding this comment.
Please add example how to add context and missing dependencies too
There was a problem hiding this comment.
I’ve added examples for contextDependencies and missingDependencies as suggested. Let me know if anything else is needed.
| You can also watch directories and even files that do not yet exist: | ||
|
|
||
| - `compilation.contextDependencies` → for directories | ||
| - `compilation.missingDependencies` → for future files |
There was a problem hiding this comment.
Please rewrite it because it is misleading, union with before text and description for each
There was a problem hiding this comment.
Thanks for the feedback!
I’ve updated the section to integrate contextDependencies and missingDependencies with clearer explanations
Let me know if anything else should be improved
| @@ -342,10 +342,14 @@ that webpack does not track by default, you must tell webpack to watch them. | |||
|
|
|||
| The `compilation.fileDependencies` set allows you to add such files. | |||
There was a problem hiding this comment.
Please union your description with it
alexander-akait
left a comment
alexander-akait
left a comment
There was a problem hiding this comment.
Please fix union, also please use ECMA modules syntax only
I’ve updated the section to unify the dependency explanations and switched the example to ECMAScript module syntax. Let me know if anything else should be improved. |
| If your plugin reads external files (config files, templates, etc.) | ||
| that webpack does not track by default, you must tell webpack to watch them. | ||
|
|
||
| The `compilation.fileDependencies` set allows you to add files that your plugin depends on, so webpack can trigger a rebuild when those files change. |
There was a problem hiding this comment.
Let's use the same pattern for compilation.contextDependencies and compilation.missingDependencies, or move compilation.fileDependencies under list, use the same style for description them
There was a problem hiding this comment.
Thanks for the feedback!
I’ve updated the section to use a consistent list format for fileDependencies, contextDependencies, and missingDependencies, and changed the wording to use webpack serve
Let me know if anything else should be improved
|
|
||
| ## Watching for file changes | ||
|
|
||
| When webpack runs in watch mode (`webpack --watch` or `devServer`), |
There was a problem hiding this comment.
webpack watch or webpack serve
2 participants
What
Adds a new section explaining how to work with file changes in watch mode.
Includes:
compiler.modifiedFilesto detect changed filescompilation.fileDependenciesto watch external filesWhy
The documentation references watch mode hooks and APIs, but does not provide
a practical example showing how to use them in a plugin.
This PR fills that gap with real-world usage examples.
How
writing-a-pluginImpact
Improves developer understanding of webpack watch mode and plugin behavior,
especially for advanced use cases involving file tracking.