如何设置我的 Vue.js 站点以在每个热重载事件时清除浏览器的 Javascript 控制台？

Question

我有一个带有Webpack Dev中间件的Vue.js网站(HTTP.sys web服务器通过ASP.NET Core网站提供服务，但我猜这无关紧要(。有人知道我如何设置我的网站，在每次热加载事件中清除浏览器的Javascript控制台吗？

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

Answer 1

在我的主应用程序.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。

Answer 2

您的链接包含对问题的回答。只需在您的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)，以便我们检查您的信息？