Error when using ref from Vue 3 composition API

Avatar
Mvanorder1390
Created

I'm using Webstorm to build a Vue 3 app.  The ref function creates a Ref object which the value attribute is then used and updated as needed to update reactive content.  However, Webstorm complains on assignment to the value attribute that “Assigned expression type {some type} is not assignable to type T”.

Here is an example:

I figured I would try typescript instead of JSDoc.  However, using TS doesn't seem to be checking types at all:

I'm confused and would love if someone knows what's going on here.

Also as far as my code and Webstorm goes, JSDoc is working great for everything except ref objects.

Votes

0

Share

3 comments
Avatar
Elena Pogorelova
Created

Can you please share a bit more context around the problem? Which version of the IDE are you using? What do your settings in Settings | Languages & Frameworks | TypeScript | Vue look like?

In 2024.1.* type checking works out of the box for me when using lang="ts":

To make it work with JavaScript, I need a tsconfig.json like the following:

{
  "compilerOptions": {
    "target": "es2016",
    "module": "commonjs",
    "esModuleInterop": true,
    "forceConsistentCasingInFileNames": true,
    "strict": true,
    "skipLibCheck": true,
    "allowJs": true,
    "checkJs": true
  }
}

 

 

0
Avatar
Mvanorder1390
Created

I'm running Webstorm 2024.1.3.

Here are the settings:

Updating my tsconfig.json didn't have any effect.

Also, this project was created as a JS Vue 2 project, later updated to Vue 3 and components are being migrated to the composition API.

0
Avatar
Elena Pogorelova
Created

It works for me in the same version using similar setup.

Could you please attach the logs from the language service? 

To collect service logs please go to Help | Diagnostic Tools | Debug Log Settings… and add #com.intellij.platform.lsp to the Custom Debug Configuration window.

Then restart the IDE, reproduce the issue, and send us all the IDE logs collected via Help | Collect Logs and Diagnostic Data….

0

Please sign in to leave a comment.