有时我在运行 webpack 的 watch 模式并编辑源文件时,不确定 webpack 是否已经打包了我的更改。
是否有一种方法可以在每次 webpack 更新 bundle 时在控制台上打印时间戳?
是否有一种方法可以在每次 webpack 更新 bundle 时在控制台上打印时间戳?
您可以添加自定义插件,例如:
config.plugins.push(new function() {
this.apply = (compiler) => {
compiler.hooks.done.tap("Log On Done Plugin", () => {
console.log(("\n[" + new Date().toLocaleString() + "]") + " Begin a new compilation.\n");
});
};
});
datou3600的答案非常棒,但为什么不让它更好呢?
稍微添加一点延迟:
以下是代码:
config.plugins.push(function(){
this.plugin('done', function(stats) {
setTimeout(
() => {
console.log(('\n[' + new Date().toLocaleString() + ']') + ' --- DONE.\n');
},
100
);
});
});
仅作更新
DeprecationWarning: Tapable.plugin is deprecated. Use new API on `.hooks` instead
您可以像这样完成:
class WatchTimerPlugin {
apply(compiler) {
compiler.hooks.done.tap('Watch Timer Plugin', (stats) => {
console.log(('\n[' + new Date().toLocaleString() + ']') + ' --- DONE.\n');
});
}
}
module.exports = WatchTimerPlugin;
如果你想以编程方式使用时间戳,例如进行调试或确保远程同步最新版本构建工作正常,你也可以使用 webpack.DefinePlugin.runtimeValue
:
new webpack.DefinePlugin({
BUILDTIME: webpack.DefinePlugin.runtimeValue(Date.now, true)
})
BUILDTIME
提供最新的构建时间。