`experimentalDecorators: true` in tsconfig.json is not working

[JounQin]

• [x] I have searched through existing issues
• [x] I have read through docs
• [x] I have read FAQ

Info

• Platform: macOS
• Vetur version: 0.11.3
• VS Code version: 1.18.1

Problem

message: 'Experimental support for decorators is a feature that is subject to change in a future release. Set the 'experimentalDecorators' option to remove this warning.'

I've add and enable experimentalDecorators option in tsconfig.json, and I tried decorator in pure .ts file, there was no warnings.

Reproducible Case

My source code:

<template lang="pug">
  #app
    router-view
</template>
<script lang="ts">
import { Component, Vue } from 'vue-property-decorator'

@Component
export default class App extends Vue {
  name = 'app'
}
</script>

[HerringtonDarkholme]

I cannot reproduce this, can you provide a repo?

[JounQin]

If you don't mind, you can checkout https://github.com/JounQin/Rubick/blob/master/src/views/landing/Login.vue for more details.

[HerringtonDarkholme]

I cloned the repo and it works fine. You can try reloading editor.

[JounQin]

@HerringtonDarkholme Oops, it really works today, but custom options for Vue plugin still does not work.

There declarations are all in src/types/shim.d.ts, which makes them work in pure .ts file and can passthrough webpack's building step.

[HerringtonDarkholme]

@JounQin I still cannot reproduce. Clicking on $v directs me to shim.d.ts.

[JounQin]

Hmmm... I restarted my Mac and it works just well now, so magically.

[JounQin]

@HerringtonDarkholme It seems if I modify global .d.ts file, vetur will not recognize that unless exiting and restarting vsc.

So is it as expected and should be documented?

[TheAkio]

I'm not sure if this is an issue of the language server or the VSCode plugin, but it doesn't work when you have a Workspace open. There is a workaround tho: Simply add a tsconfig.json to the workspace directory with the proper configuration. Then this will fix the issue in workspaces.

[aboutqx]

Still not working in a vue file with tsconfig "experimentalDecorators": true, "allowJs": true, and vscode config "javascript.implicitProjectConfig.experimentalDecorators": true ,even with restart.

[TheAkio]

The issue is tracked here: https://github.com/vuejs/vetur/issues/424

[yang-ml]

Actually, I'm still confused with the cause of this issue, but set "include" path in tsconfig.json is working for me.

Before:

"include": [
    // "src/**/*.ts"
  ]

Worked After:

{
  "compileOnSave": true,
  "compilerOptions": {
    "module": "esnext",
    "moduleResolution": "node",
    "target": "es5",
    "lib": ["dom", "es2015", "es2016"],
    "sourceMap": false,
    "declaration": true,
    "experimentalDecorators": true,
    "jsx": "react",
    "outDir": "lib",
    "noUnusedLocals": false 
  },
  "exclude": [
    "node_modules",
    "static",
    "lib"
  ],
  "include": [
    "src/**/*.ts"
  ]
}

I'm happy if somebody can point out my mistakes in the config file.

[octref]

include tells Vetur to load the specified files with the compilerOptions you have given. Not specifying it falls back to using the default compilerOptions which doesn't set experimentalDecorators.

[flatcoke]

It was not resolved by any of the above solutions, but it was fixed by updating vscode to the latest version.

[vguleaev]

It was not resolved by any of the above solutions, but it was fixed by updating vscode to the latest version.

I have latest version but I still can see the error when I do export default @observer class MyPageName

[Pablofr10]

I just put "experimentalDecorators": true in tsconfig.json

[yoyo930021]

I just put "experimentalDecorators": true in tsconfig.json

If you set, please restart VSCode. Still have problems, please open a new issue with template.

[Pablofr10]

I just put "experimentalDecorators": true in tsconfig.json

If you set, please restart VSCode. Still have problems, please open a new issue with template.

It's solved my problem. 🤗🤗

[anilanar]

For majority of you, it's caused by

include: "src/**/*.ts"

It needs to be without .ts extension.

include: "src/**/*"

[edilsonalvarado]

Actually, I'm still confused with the cause of this issue, but set "include" path in tsconfig.json is working for me.

Before:

"include": [
    // "src/**/*.ts"
  ]

Worked After:

{
  "compileOnSave": true,
  "compilerOptions": {
    "module": "esnext",
    "moduleResolution": "node",
    "target": "es5",
    "lib": ["dom", "es2015", "es2016"],
    "sourceMap": false,
    "declaration": true,
    "experimentalDecorators": true,
    "jsx": "react",
    "outDir": "lib",
    "noUnusedLocals": false 
  },
  "exclude": [
    "node_modules",
    "static",
    "lib"
  ],
  "include": [
    "src/**/*.ts"
  ]
}

I'm happy if somebody can point out my mistakes in the config file.

It worked. It's strange because I was working and suddenly error appeared. Thanks a lot.