webpack自定义loader为啥只在项目启动时执行,代码热更新时并不执行?

2023-06-23 379 0

webpack自定义loader为啥只在项目启动时执行,代码热更新时并不执行,
如何让每次代码改变后保存代码也能让自定义loader执行一遍?就行编译错误一样每次保存都会校验一遍。

Webpack自定义loader在项目启动时执行,但在代码热更新时不执行的原因是由于Webpack的工作流程和热更新机制的设计。

在Webpack的工作流程中,当项目启动时,Webpack会根据配置文件中的规则(rules)来匹配文件,并将匹配到的文件交给相应的loader进行处理。这个处理过程是在构建(build)阶段完成的,它将源文件转换为目标文件。

然而,在代码热更新过程中,Webpack的目标是尽可能地快速更新已经修改的模块,而不重新构建整个项目。为了实现这一点,Webpack使用了一种称为HMR(Hot Module Replacement)的机制。当一个模块发生改变时,Webpack只会替换掉这个模块,而不会重新构建整个项目。

由于自定义loader是在构建阶段执行的,而热更新只会替换已修改的模块,而不会重新构建整个项目,因此自定义loader并不会在热更新过程中执行。

如果你希望在代码热更新时也执行自定义loader的逻辑,可以考虑使用Webpack的插件(plugin)机制来实现。Webpack的插件可以监听HMR事件,并在模块发生改变时执行自定义逻辑。你可以编写一个插件来监听HMR事件,并在事件发生时执行自定义loader的逻辑。这样就可以在热更新过程中实现自定义loader的执行了。

回答

相关文章

nuxt2部署静态化和ssr的时候访问首页先报404再出现首页为什么?
`clip-path` 如何绘制圆角平行四边形呢?
多线程wait方法报错?
VUE 绑定的方法如何直接使用外部函数?
vue2固定定位该怎么做?
谁有redis实现信号量的代码,希望借鉴一下?