6

我有一个带有 Webpack Dev Middleware 的 Vue.js 站点（由 HTTP.sys Web 服务器通过 ASP.NET Core 站点提供服务，尽管我猜这并不重要）。有谁知道我如何设置我的网站以在每次热重载事件时清除浏览器的 Javascript 控制台？

这是我能找到的唯一相关链接，但它似乎适用于我没有使用的网络服务器。我不确定为什么特定的 Web 服务器很重要。

4

2 回答 2

11

在我的主应用程序 .js 文件中：

if (module.hot) {
    module.hot.accept() // already had this init code 

    module.hot.addStatusHandler(status => {
        if (status === 'prepare') console.clear()
    })
}

这让它一直为我工作。

另请参阅https://webpack.js.org/api/hot-module-replacement/#addstatushandler。

于 2018-12-26T15:06:49.753 回答
10

您的链接包含对您问题的答复。只需在您的main.js文件中添加：

window.addEventListener('message', (e) => {
  if (e.data && typeof e.data === 'string' && e.data.match(/webpackHotUpdate/)) {
    console.log('hot reload happened')
    console.clear()
  }
})

完整的 main.js 文件示例：

import Vue from 'vue'
import App from './App.vue'
import router from './router'
import store from './store'

Vue.config.productionTip = false

new Vue({
  router,
  store,
  render: h => h(App)
}).$mount('#app')

window.addEventListener('message', (e) => {
  if (e.data && typeof e.data === 'string' && e.data.match(/webpackHotUpdate/)) {
    console.log('hot reload happened')
    console.clear()
  }
})

编辑：我没有阅读您对 github 问题的回答。您能否提供一些JSON.stringify(e)关于多个事件的事件消息，以便我们检查您有什么？

于 2018-12-20T11:10:15.407 回答