Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[Bug] Vue 3 HMR does not work inside a default slot using PrimeVue #7234

Closed
martinszeltins opened this issue Nov 29, 2022 · 1 comment
Closed
Labels
duplicate This issue or pull request already exists

Comments

@martinszeltins
Copy link

Vue version

3.2.45

Link to minimal reproduction

https://github.com/martinszeltins/vue-hmr-not-working-slot

Steps to reproduce

I don't know if this is an issue with Vue or Vite or PrimeVue... but since it has to do with HMR, I figured it must be a Vue issue.

Here are the steps to reproduce the bug:

  1. Clone and run the project.
$ git clone git@github.com:martinszeltins/vue-hmr-not-working-slot.git
$ cd vue-hmr-not-working-slot
$ npm install
$ npm run dev
  1. Now open App.vue and change the default slot of TabPanel (line 9). Then save the App.vue file and look at the browser - HMR did not work unless you manually reload the page.

All I did was take the Vite starter template and added PrimeVue.

$ npm create vite@latest my-vue-app -- --template vue
$ cd my-vue-app
$ npm install
$ npm install primevue@^3 --save
$ npm install primeicons --save

Then I added PrimeVue to main.js like this:

import { createApp } from 'vue'
import './style.css'
import App from './App.vue'
import PrimeVue from 'primevue/config'
import AppModal from 'primevue/dialog'

const app = createApp(App);

app.use(PrimeVue);
app.component('AppModal', AppModal);
app.mount('#app')

And then I added the component in App.vue as you can see from the reproduction repo. I didn't change anything else. Something is wrong.

What is expected?

I was expecting HMR to work and auto refresh the content inside the default slot but it is not working unless I reload the whole page.

What is actually happening?

HMR is not working as expected.

System Info

System:
    OS: Linux 5.15 Ubuntu 20.04.5 LTS (Focal Fossa)
    CPU: (8) x64 Intel(R) Core(TM) i5-10300H CPU @ 2.50GHz
    Memory: 9.56 GB / 31.26 GB
    Container: Yes
    Shell: 5.8 - /usr/bin/zsh
  Binaries:
    Node: 18.12.1 - ~/.nvm/versions/node/v18.12.1/bin/node
    Yarn: 1.22.19 - /usr/bin/yarn
    npm: 8.19.2 - ~/.nvm/versions/node/v18.12.1/bin/npm
  Browsers:
    Chrome: 107.0.5304.121
    Firefox: 107.0
  npmPackages:
    vue: ^3.2.41 => 3.2.45
    primevue: 3.20.0
    vite: 3.2.3

Any additional comments?

No response

@zhangzhonghe zhangzhonghe added the duplicate This issue or pull request already exists label Dec 12, 2022
@zhangzhonghe
Copy link
Member

Duplicate of #7155

@zhangzhonghe zhangzhonghe marked this as a duplicate of #7155 Dec 12, 2022
@zhangzhonghe zhangzhonghe closed this as not planned Won't fix, can't repro, duplicate, stale Dec 12, 2022
@github-actions github-actions bot locked and limited conversation to collaborators Sep 17, 2023
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
duplicate This issue or pull request already exists
Projects
None yet
Development

No branches or pull requests

2 participants