Every time I start a project with the official Vue extension, I get an error in vscode from the change monitor

[cerm88]

Vue - Official extension or vue-tsc version

v2.1.6

VSCode version

v1.93.1

Vue version

v3.4.29

TypeScript version

Only Js and TS any version

System Info

System:
    OS: Windows 10 10.0.19045
    CPU: (12) x64 Intel(R) Core(TM) i5-10400 CPU @ 2.90GHz
    Memory: 19.30 GB / 31.86 GB
 Binaries:
    Node: 20.16.0 - C:\Program Files\nodejs\node.EXE      
    npm: 10.8.1 - C:\Program Files\nodejs\npm.CMD
    pnpm: 9.9.0 - ~\AppData\Local\pnpm\pnpm.EXE
 Browsers:
    Edge: Chromium (127.0.2651.74)
    Internet Explorer: 11.0.19041.4355

package.json dependencies

{
"dependencies": {
    "@material-symbols/svg-400": "0.22.2",
    "@vee-validate/yup": "4.13.2",
    "@vueuse/core": "10.11.1",
    "axios": "1.7.3",
    "dayjs": "1.11.13",
    "jwt-decode": "4.0.0",
    "maska": "3.0.0",
    "pinia": "2.1.7",
    "vee-validate": "4.13.2",
    "vue": "3.4.29",
    "vue-router": "4.3.3",
    "yup": "1.4.0"
  },
  "devDependencies": {
    "@rushstack/eslint-patch": "1.8.0",
    "@vitejs/plugin-vue": "5.0.5",
    "@vue/eslint-config-prettier": "9.0.0",
    "@vue/test-utils": "2.4.6",
    "eslint": "8.57.0",
    "eslint-plugin-import": "2.29.1",
    "eslint-plugin-vue": "9.23.0",
    "jsdom": "24.1.0",
    "postcss-preset-env": "10.0.0",
    "prettier": "3.2.5",
    "sass": "1.77.8",
    "stylelint": "16.8.1",
    "stylelint-config-prettier-scss": "1.0.0",
    "stylelint-config-recess-order": "5.0.1",
    "stylelint-config-recommended-vue": "1.5.0",
    "stylelint-config-standard-scss": "13.1.0",
    "stylelint-scss": "6.4.1",
    "vite": "5.3.1",
    "vite-svg-loader": "5.1.0",
    "vitest": "1.6.0"
  }
}

Steps to reproduce

• I open the Vue project from vscode where I have a profile exclusively with Vue extensions
• Then I get the following message in the notifications "The file change monitor has stopped unexpectedly."
• I know it is exactly the official Vue extension because when I disable it the problem disappears

What is expected?

The Vue Devtools extension's file change monitor is expected to work seamlessly, detecting and reflecting in real-time any modifications made to Vue components. When you save changes to a .vue file, the component view is expected to automatically update to display the changes made.

What is actually happening?

Change monitor stops unexpectedly when saving changes to a Vue component, displaying the message "File Change Monitor stopped unexpectedly". This occurs consistently when working with large projects. The interruption of the change monitor forces you to manually reload the window to view the changes, which breaks your workflow.

Link to minimal reproduction

No response

Any additional comments?

No response

[davidmatter]

Hey @cerm88, would you please list your installed extensions? Does it happen too when you only activate the vue extension?

[cerm88]

Hi @davidmatter the installed extensions are the following:

By disabling the official Vue extension the problem is quickly eliminated, meaning that the problem is due to said extension.

I also attached my Vue VSCode profile for you to try: Frontend Vue.zip

[davidmatter]

I mean the other way around. Please try with an empty profile and only the Vue extension activated, thanks.

[cerm88]

Even leaving the profile empty and only enabling the Vue extension, the same problem occurs to me, ultimately, it is the extension

[RayGuo-ergou]

can you check the typescript version attached to typescript extension?

[cerm88]

can you check the typescript version attached to typescript extension?

Remember that the Official Vue extension with TS is no longer available, and if I try to install it with .vsix it doesn't work either

[RayGuo-ergou]

typescript server is always running underness, enable hybrid (take over mode) or not only changes the way to communicate with typescript server. Thus, it's very likely outdated typescript version would be the cause of this issue.

[cerm88]

@davidmatter @RayGuo-ergou This usually happens to me when I am on a project where there are many components, that is, a large project.

[RayGuo-ergou]

Try to assign more memory to tsserver then. If still happening please create a minimal reproduction.

[johnsoncodehk]

Please update VSCode extension to 3.0. If the problem still exists, please provide a minimal reproduction.