Skip to content

CalebM1987/vite-ts-test

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

3 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Vue language features issue

This repo is used to describe the following issue with the Vue language services in vue single file component templates.

bug: html.customData from settings.json ignored in Vue templates (parity gap with native HTML)

Description
The Vue - Official extension does not honor html.customData configurations defined in .vscode/settings.json. While VS Code's native HTML language service correctly loads this data for standard .html files, the Vue language server (Volar) fails to provide the same Intellisense, hover documentation, or attribute completion within .vue SFC templates.

Reproduction

  • Reproduction Repository: [GitHub Repo]
  • Vendor Data Source: @arcgis/map-components and @esri/calcite-components (via node_modules)
    • these libraries provide definitions for .vscode/settings.json for providing intellisense of their HTML elements

      {
        "html.customData": [
          "./node_modules/@arcgis/map-components/dist/docs/vscode.html-custom-data.json",
          "./node_modules/@esri/calcite-components/dist/docs/vscode.html-custom-data.json"
        ],
        "css.customData": [
          "./node_modules/@arcgis/map-components/dist/docs/vscode.css-custom-data.json",
          "./node_modules/@esri/calcite-components/dist/docs/vscode.css-custom-data.json"
        ]
      }

Steps to Reproduce:

  1. Clone the reproduction repo and run npm install.
  2. Open .vscode/settings.json to verify html.customData paths point correctly to JSON files in node_modules.
  3. Open vanilla-app/index.html (vanilla). Hover over <arcgis-map> or <calcite-button>.
    • Result: Full documentation and attribute suggestions appear correctly.
  4. Open the vue-app/src/components/MapViewer.vue file in the same workspace. Hover over the same tags in the <template> block.
    • Result: No documentation appears; attributes provide no Intellisense.

Expected Behavior
The Vue language server should ingest html.customData from the workspace settings to provide a consistent development experience with native HTML, especially for projects utilizing Web Component libraries.

Actual Behavior
The html.customData setting is ignored by the extension, leaving custom elements without typings in Vue templates despite being correctly configured in the workspace.

Environment

  • Extension Version: Vue - Official v3.2.2 (2026)
  • VS Code Version: 1.107.1
  • Hybrid Mode: I have tried doing this with hybrid mode both enabled and disabled
  • OS: MacOS Sequoia 15.6.1 (24G90)

Additional Context
I have verified that isCustomElement is configured in vite.config.ts and vueCompilerOptions in tsconfig.json. While this silences compiler warnings, it does not enable the IDE-level metadata (descriptions and autocomplete) that should be provided by the Custom Data JSON files. Standard HTML files in the same workspace work as expected, indicating this is specific to the Vue Language Server.

Screenshots

Intellisense works properly in the vanilla-ts/index.html file:

resources/images/vanilla-ts.png

Intellisense does not work in the vue-app/components/MapViewer.vue file:

resources/images/vue-ts.png

About

Reproduction repository to show issue between custom component intellisense in vite/vue based apps vs vanilla ts

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

 
 
 

Contributors