在Webpack插件中添加依赖项(Add Dependency in Webpack Plugin)

在Webpack插件中添加依赖项(Add Dependency in Webpack Plugin)

是否可以在Webpack插件中添加依赖项？ 我正在生成使用模板的文件，当这些模板发生变化时，我会像webpack --watch一样触发另一个构建。

这是插件：

function BlahPlugin (options) { this.options = options; } BlahPlugin.prototype.apply = function (compiler) { // This is the file that I'd like to "watch" var template = this.options.template; compiler.plugin('emit', function (compilation, callback) { var body = Object.keys(compilation.assets).join("\n"); require("fs").readFile(template, "utf8", function (err, data) { var content = data.replace("{{body}}", body); compilation.assets["out.txt"] = { source: function () { return content; }, size: function () { return content.length; } }; callback(); }); }); }; module.exports = BlahPlugin;

这取自这个完整的工作项目： https ： //gist.github.com/thatismatt/519d11b2c902791bb74b

如果运行./node_modules/.bin/webpack --watch并修改js文件，编译会自动触发并生成已编译的js文件和out.txt（如BlahPlugin中所指定）。 但是如果你改变了tmpl.txt文件，那是在webpack配置中指定并在BlahPlugin中使用的，那么编译就不会重新触发。 （这是预料之中的）。 但这就是我想要发生的事情，我如何告诉Webpack“观察”该文件？

Is it possible to add a dependency from within a Webpack plugin? I'm generating files that use templates, when these templates change I'd like webpack --watch to trigger another build.

Here is the plugin:

function BlahPlugin (options) { this.options = options; } BlahPlugin.prototype.apply = function (compiler) { // This is the file that I'd like to "watch" var template = this.options.template; compiler.plugin('emit', function (compilation, callback) { var body = Object.keys(compilation.assets).join("\n"); require("fs").readFile(template, "utf8", function (err, data) { var content = data.replace("{{body}}", body); compilation.assets["out.txt"] = { source: function () { return content; }, size: function () { return content.length; } }; callback(); }); }); }; module.exports = BlahPlugin;

This is taken from this full working project: https://gist.github.com/thatismatt/519d11b2c902791bb74b

If you run ./node_modules/.bin/webpack --watch and modify a js file the compilation automatically triggers and produces the compiled js files and out.txt (as specified in the BlahPlugin). But if you change the tmpl.txt file, that is specified in the webpack config and used in the BlahPlugin then the compilation doesn't re-trigger. (Which is to be expected). But this is what I want to happen, how can I tell Webpack to "watch" that file?

最满意答案

我通过添加以下内容修复了此问题：

compiler.plugin("emit", function (compilation, callback) { compilation.fileDependencies.push(path.join(compiler.context, template)); // ... });

我也更新了要点，所以你可以在那里看到完整的修复程序： https ： //gist.github.com/thatismatt/519d11b2c902791bb74b

注意：这有效，但它有点像黑客。

I fixed this by adding the following:

compiler.plugin("emit", function (compilation, callback) { compilation.fileDependencies.push(path.join(compiler.context, template)); // ... });

I've also update the gist, so you can see the full fix there: https://gist.github.com/thatismatt/519d11b2c902791bb74b

NOTE: this works but it is a bit of a hack.