Nuxt Firefox console errors webpack hmr
I just made a brand new project with Nuxt using the npx create-nuxt-app command.
This error might not be related to Nuxt it self but its really annoying to have it in all my nuxt projects and I struggle to get rid of it. It appears in Firefox developer edition when I run the npm run dev command for localhost.
The connection to http://localhost:3000/__webpack_hmr/client was interrupted while the page was loading.
The connection to http://localhost:3000/_loading/sse was interrupted while the page was loading.
Any idea how to get rid of this ? thanks
Wow, never realized this error is always present in Firefox. Usually, this kind of thing just disappear when your refresh the page once but it looks like it is persisted in Firefox indeed.
I guess this have something to do with the way HMR websockets are done.
Here is a github issue talking about the problem and here is the most up to date mozilla bug report.
Not sure if the latter is anyhow relevant.
Maybe this is just a flag to set in Firefox or something related to Vue specifically. Nonetheless, you can filter-out some errors but putting -<your-query> in the console search. Works great to remove some annoying error that you don't really care about.
This is how it looks
- How to use v-icon in vuetify text-area label instead of text?
- Vue.js, emit multiple parameters from child to parent
- Unable to login to web app when using VSCode Chrome Debugger
- Get source of pasted text
- Using find, match and filter with reactive array in VueJS - how do I?
- Could not find a declaration file for module 'vuex' with create-vue
- How to implement debounce in Vue2?
- How to find the keys of the values in a json using forEach and change the values of the relevant keys using typescript vue js?
- Send additional info to server in uploading image process
- How to access ref element that being conditionally rendered in v-if - Vue
- PrimeVue theme change
- How to build a multi pages application by vite2 and vue3？
- Why is there a "No overload matches this call" error when passing a reactive prop?
- Using xgettext to extract translatable strings from VueJS file
- Watch route object in VueJS 2
- SyntaxError: Cannot use import statement outside a module { AXIOS }
- Watch/observe number of DOM children in Vue
- MutationObserver on Vue Component
- How to disable a single v-expansion-header
- Footer not sticky to bottom bootstrap 5.2.2
- How do I use /deep/ or >>> or ::v-deep in Vue.js?
- How to call the methods exposed by components in slots with Vue 3 Composition API
- Vue3 equivalent of vNode.computedInstance
- Vue.js parent <-> child updating value, routing view
- Vuejs. Cannot set properties of undefined (setting)
- want to use vuetify snackbar as a global custom component in vuejs
- Feature flag __VUE_PROD_HYDRATION_MISMATCH_DETAILS__ is not explicitly defined. Where do I define it?
- Vue - how to pass down slots inside wrapper component?
- V-If elements displaying regardless of condition resolving to false
- getActivePinia was called with no active Pinia. Vue