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] HMR does not work in 3.3 alpha 9 #8061

Closed
martinszeltins opened this issue Apr 11, 2023 · 1 comment
Closed

[Bug] HMR does not work in 3.3 alpha 9 #8061

martinszeltins opened this issue Apr 11, 2023 · 1 comment

Comments

@martinszeltins
Copy link

Vue version

3.3.0-alpha.9

Link to minimal reproduction

https://github.com/martinszeltins/vue-hmr-3.3

Steps to reproduce

I wanted to try out the new Vue 3.3 alpha 9 release but I found that HMR is not working.

1. Start a new Vue project
pnpm create vite my-vue-app --template vue-ts

2. Install PrimeVue
pnpm install primevue primeicons

3. main.ts

import App from './App.vue'
import { createApp } from 'vue'
import PrimeVue from 'primevue/config'

const app = createApp(App)
app.use(PrimeVue)
app.mount('#app')

4. App.vue

<template>
    <TabView>
        <TabPanel header="My Tab">
            This content does not HMR refresh automatically 😞
        </TabPanel>
    </TabView>
</template>

<script setup lang="ts">
    import TabView from 'primevue/tabview'
    import TabPanel from 'primevue/tabpanel'
</script>

5. package.json - update to latest versions of Vue and Vite

{
  "name": "my-vue-app",
  "private": true,
  "version": "0.0.0",
  "type": "module",
  "scripts": {
    "dev": "vite",
    "build": "vue-tsc && vite build",
    "preview": "vite preview"
  },
  "dependencies": {
    "primeicons": "^6.0.1",
    "primevue": "^3.26.1",
    "vite-plugin-warmup": "^0.0.2",
    "vue": "3.3.0-alpha.9"
  },
  "devDependencies": {
    "@vitejs/plugin-vue": "^4.1.0",
    "typescript": "^4.9.3",
    "vite": "4.3.0-beta.4",
    "vue-tsc": "1.3.14"
  }
}

6. Edit App.vue the content inside TabPanel and you will see that the content does not refresh automatically unless you refresh the whole page

What is expected?

The expected behavior is that if you update the content text inside of App.vue then it should automatically HMR refresh but it does not happen and you need to refresh the whole page to see the changes.

What is actually happening?

The content of the component does not refresh automatically with HMR.

System Info

System:
    OS: Linux 5.15 Ubuntu 20.04.6 LTS (Focal Fossa)
    CPU: (12) x64 Intel(R) Core(TM) i7-10750H CPU @ 2.60GHz
    Memory: 20.63 GB / 31.14 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: 111.0.5563.110
    Firefox: 111.0.1
  npmPackages:
    vue: 3.3.0-alpha.9 => 3.3.0-alpha.9

Any additional comments?

No response

@martinszeltins martinszeltins changed the title [Bug] HMR does not work in 3.3 appha 9 [Bug] HMR does not work in 3.3 alpha 9 Apr 11, 2023
@haoqunjiang
Copy link
Member

Duplicate of #7155

@haoqunjiang haoqunjiang marked this as a duplicate of #7155 Apr 14, 2023
@haoqunjiang haoqunjiang closed this as not planned Won't fix, can't repro, duplicate, stale Apr 14, 2023
@github-actions github-actions bot locked and limited conversation to collaborators Sep 11, 2023
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants