有没有办法在 webpack 监视模式下在屏幕上显示 webpack 上次更新构建时的时间戳?
Is there a way in webpack watch mode to display on screen the timestamp when webpack last updated the build?
有时,当 运行 webpack 处于监视模式并编辑源文件时,我不确定 webpack 是否打包了我的更改。
有没有办法在每次 webpack 更新包时在控制台打印时间戳?
它显示 watcher 重建发生的时间。
您可以添加自定义插件,例如:
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
为您提供最新的构建时间。
有时,当 运行 webpack 处于监视模式并编辑源文件时,我不确定 webpack 是否打包了我的更改。
有没有办法在每次 webpack 更新包时在控制台打印时间戳?
它显示 watcher 重建发生的时间。
您可以添加自定义插件,例如:
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
为您提供最新的构建时间。