experimentalDecorators Typescript warning always present

[dbaeumer]

From @giacomorebonato on June 23, 2016 18:53

• VSCode Version: 1.3.0-insider
• OS Version: El Capitan

Steps to Reproduce:

1. Create a Typescript project
2. Use decorators (I am using Mobx)

I keep seeing the warning:

[ts] Experimental suport for decorators is a feature that is subject to chang in a future release. Set the 'experimentalDecoratos' option to remove this warning.

Where should I set this option? Because my tsconfig.json should be right

{
  "compilerOptions": {
    "target": "es5",
    "module": "commonjs",
    "declaration": false,
    "noImplicitAny": false,
    "removeComments": false,
    "isolatedModules": false,
    "jsx": "react",
    "experimentalDecorators": true,
    "emitDecoratorMetadata": true,
    "noLib": false,
    "preserveConstEnums": true,
    "suppressImplicitAnyIndexErrors": true,
    "outDir": "./dist/"
  },
  "exclude": [
    "client",
    "node_modules",
    "typings/browser",
    "typings/browser.d.ts"
  ]
}

Copied from original issue: microsoft/vscode#8069

[mhegazy]

I could not get this to reproduce on a simple project. can you share more context.

[giacomorebonato]

This is the repo that I am using.

[mhegazy]

What version of TS are you using? are you using the nightly build (https://github.com/Microsoft/TypeScript-Handbook/blob/master/pages/Nightly%20Builds.md#visual-studio-code) ?

[DanielRosenwasser]

I think this is potentially a duplicate of #8905.

[giacomorebonato]

I am using "typescript": "^1.8.10" . Should I use a dev one?

[mhegazy]

looks like a duplicate of #8905 then. can you give the nightly a try and see if it resolves the issue for you? here are the instructions: https://github.com/Microsoft/TypeScript-Handbook/blob/master/pages/Nightly%20Builds.md#visual-studio-code.

[giacomorebonato]

Problem still present with
"typescript": "^2.0.0-dev.20160628"
"tslint": "^3.12.0-dev.2"

[DanielRosenwasser]

@giacomorebonato are you running El Capitan with case-sensitivity on your drive? @laurelnaiad was running into this over Gitter.

[laurelnaiad]

My details:

• case sensitive HFS+ on El Capitan
• node 5.12.0
• typescript Version 2.0.0-dev.20160705
• VSCode version 1.2.1

Peculiarities:

• experimentalDecorators warnings
• paths that should be resolvable based on baseUrl setting of "." are not properly resolved

I cannot say when either of these issues might have developed, since I've been using atom-typescript throughout -- every time I've tried to use VSCode I've not been able to get it to work, though I don't know if the same issue has been the reason each time.

[giacomorebonato]

Sorry for all the mess.. I don't know why I was excluding all client code in tsconfig... Everything works know.
Thanks for the support.

[mhegazy]

@laurelnaiad looks like your tsconfig.json has errors or the file you are working on is not included in this tsconfig.json (either excluded or not in the folder).

[mhegazy]

thanks @giacomorebonato for getting back to us on this. closing.

[laurelnaiad]

@laurelnaiad looks like your tsconfig.json has errors or the file you are working on is not included in this tsconfig.json (either excluded or not in the folder).

Hi @mhegazy. Hmm. As far as I know, those statements aren't true.

{
    "externalTranspiler": {
        "name": "babel",
        "options": {}
    },
    "buildOnSave": false,
    "compileOnSave": false,
    "indentSize": 2,
    "tabSize": 2,
    "compilerOptions": {
        "suppressOutputPathCheck": true,
        "baseUrl": ".",
        "noEmit": false,
        "declaration": false,
        "moduleResolution": "node",
        "module": "commonjs",
        "target": "es6",
        "allowNonTsExtensions": true,
        "experimentalDecorators": true,
        "emitDecoratorMetadata": true,
        "jsx": "react",
        "removeComments": false,
        "noLib": false,
        "preserveConstEnums": false,
        "suppressImplicitAnyIndexErrors": true
    },
    "filesGlob": [
        "app/**/*.ts"
    ],
    "files": [
        "app/routing.ts"
    ],
    "atom": {
        "rewriteTsconfig": false
    }
}

I abbreviated the files and filesGlob. The first symptom -- which I only see in VSCode, not elsewhere -- is that a module like app/routing can't be located by vs code at 'app/routing' . But it can via a relative path './app/routing'.

... and the second symptom is this ghost experimentalDecorators error -- again, only in VSCode.

I've tried it with or without the atom and externalTranspiler properties, just in case they were cause the issue, to no effect.

Is the above tsconfig invalid? (I mean, I don't mean to be pushy, but we've been building this app for a couple of months now, have a team of developers building it, people evaluating it, etc.. somehow it's all getting built with this tsconfig, just not in VScode 😄 )

[DanielRosenwasser]

So long as tsc works with the tsconfig.json, that file should be valid.

By the way @laurelnaiad, do you have a .vscode file? Just wondering if that could throw things off

[laurelnaiad]

Wow, ok... tsc was unhappy.

error TS5023: Unknown compiler option 'suppressOutputPathCheck'.
error TS5023: Unknown compiler option 'allowNonTsExtensions'.

I removed them, and it's much happier. It's odd that we have been going for months with those settings in place and building through gulp with no issues using our build process, but glad that's sorted out now. Thank you!

[mhegazy]

Glad it is resolved.

[laurelnaiad]

Ah, now I remember: suppressOutputPathCheck is necessary in at least one of my projects to prevent a TypeScript: emit failed problem that results in no output. It would be awesome if that option would be allowed from tsc command line and vscode. Is there a reason that the suppressOutputPathCheck is (apparently) not really supposed to be there? To be honest, I'm not really sure of the finer details of why it's necessary to build my project, but I guess I'm caught in the middle for some reason.

[mhegazy]

This should not be used. If u r using it because of a gulp-typescript issue, then it should be addesed there. If this is a TS issue, I would love to hear more about the root cause and see what we can do to solve the issue. If you are using it because one of your input files is an output file as well, then I would expect that to be an easy fix.

[laurelnaiad]

If you are using it because one of your input files is an output file as well, then I would expect that to be an easy fix.

Well I do have several projects, and a few of them are interdependent. Is that what you mean by input files being output files as well? Within any single project, there aren't (to my knowledge), any such cases, but one project generates d.ts files that another project references. Is that my problem?

[laurelnaiad]

Sorry, you gave three possible reasons why I might be using that flag... the reason I'm using it is that back when I was trying to figure out why the project wouldn't compile in atom-typescript, I tracked down this flag in the source code, and it looked perfectly designed for enabling me to move forward! :) , so I added it to atom-typescript's schema to allow it, thinking it was just missing from atom-typescript's schema. Ugh. I didn't realize the flag was intended to be private. I'm sorry about that. Still not clear on what I'm doing fundamentally wrong here with the project dependencies.

[laurelnaiad]

One of my projects was referencing its own d.ts files. Sneaky. I'm sorry for the noise.

[DanielRosenwasser]

Glad it was resolved @laurelnaiad!

[vapits]

Guys I cannot also remove this warning from any of my projects. Literally tried everything, every project has different tsconfing.json file and none is removing this.

Let's focus on this:

{
  "compilerOptions": {
    "declaration": false,
    "emitDecoratorMetadata": true,
    "experimentalDecorators": true,
    "lib": ["es6", "dom"],
    "mapRoot": "./",
    "module": "es6",
    "moduleResolution": "node",
    "outDir": "../dist/out-tsc",
    "sourceMap": true,
    "target": "es5",
    "typeRoots": [
      "../node_modules/@types"
    ],
    "types": [
      "jasmine"
    ]
  }
}

I'm using 1.4.0 version of vscode and 2.0.0 of typescript

[mcraz]

• Change experimentalDecorators to false.
• Go to a class with decorators ( you will see the message )
• Change experimentalDecorators to true.
• Go to a class with decorators ( you will NOT see the message )

Worked for me.

[Venryx]

For me, the problem was that my tsconfig.json file had a error/warning, "error TS18003: Build:No inputs were found in config file [...]".

Once I resolved the error/warning, the "experimentalDecorators: true" setting worked as expected.

[zxr90]

Just listing my solution here if anyone faced the same problem I had where typescript fails to compile files that has the error [ts] Experimental support for decorators is a feature that is subject to change in a future release. Set the 'experimentalDecorators' option to remove this warning.

Using VSCode 1.11.2 , Typescript 2.2.2

• Change experimentalDecorators to false.
• Put in the include options in your tsconfig "include": [ "src/**/*"]
• Restart VSCode

[lucax88x]

I confirm it, setting experimentalDecorator to false removed the warning. This is indeed weird becuase the warnings says the opposite.

[FabioAntunes]

I'm just giving my two cents, make sure you have the right name, my file was .tsconfig.json it took me a while to see that I was using the wrong filename.

[jhnoor]

Thank you @zxr90! For me just setting "include": [ "src/**/*"] and restarting vscode solved the issue.

[cuznerdexter]

Well I feel stupid! Here's my ten cents ....
I have tried every suggestion I have found on GitHub .. nothing was working.
@zxr90 idea was right for me.

my include path has been wrong for months!
had it set to include: [ "./app/*.ts" ] ... But my project needed include: [ "./src/app/*.ts"]

Now all my files look nice and clean :)

[Lafaa]

It seems like the problem occurs if you "open a folder" where the config is not included.
Eg. if i open my angular 2 app folder, everything works fine, but if i open myapp/src/app i have the issue

[samuba]

@Lafaa I can confirm this.
All the other solutions did not work. Looks like a bug in vscode or tsc for me

[krojew]

Can also confirm I have this bug for a long time. Pretty annoying.

[Venryx]

Had this problem in a second project. The reason was that I had ".tsx" files, but my tsconfig was only set to include ".ts" files:

	"include": [
		"Typings/**/*.d.ts",
		"Source/**/*.ts",

		// this was missing
//		"Source/**/*.tsx"
	],

Once I added ".tsx" as an include pattern, the error went away in those files.

[emirotin]

I've just seen this warning in NON-TS project in VSCode.
My sources are pure JS, have .js extensions, I'm using babel transform for handling decorators.

[lisa13]

All it took for me was to open the tsconfig.json and update
the

"lib": [
"es2016",
"dom"
]

to

"lib": [
"es2017",
"dom"
]

[daple]

Hi,

just in case someone comes across this again:
Had the same weird warning. Transpilation went well though.

After putting the tsconfig.json in the root folder of my project the squiggly lines went away.
(before I had it in my src folder where all the typescript is ... :o)

[JacobWeisenburger]

I have read through most of the solutions on here and none of them have worked for me. Not sure what to do to fix this error.

here is my tsconfig.json:

{
  "compileOnSave": false,
  "compilerOptions": {
    "outDir": "./dist/out-tsc",
    "sourceMap": true,
    "declaration": false,
    "moduleResolution": "node",
    "emitDecoratorMetadata": true,
    "experimentalDecorators": true,
    "target": "es6",
    "typeRoots": [
      "node_modules/@types"
    ],
    "lib": [
      "es2015",
      "dom"
    ]
  }
}

[lisa13]

@offg777 Try changing "es2015" to "es2017", or match your VSCode with the same typescript version as the application you are currently working on. It is in your package.json file.

[JacobWeisenburger]

@lisa13 Try changing "es2015" to "es2017"

Didn't fix the issue.

---

@lisa13 match your VSCode with the same typescript version as the application you are currently working on. It is in your package.json file

How do I change what version VSCode is using?

[lisa13]

@offg777
Open your VSCode workspace, just an empty workspace, no app. You will see the settings sign on the bottom left corner. Click on it and choose: Settings. This will take you to the settings.json.

There's a bunch of guys who had already commented on how to do the rest. Just scroll up and check out the comments.
You want to configure settings on a user level. So you don't need to have a .vscode folder. Just configure the path in settings.json.
Hope this helps. If not, use this link to learn how to get to the settings.json and make changes: https://code.visualstudio.com/docs/getstarted/settings

[carson-alveo]

I've tried several of the solutions here, and none are working for me. The editor was working fine until yesterday, and today, I am having this weird bug. Funny thing is I am using decorators at three different places, but it is only showing on one of them. If I create any new files that use decorators, it'll show the same error. Even when I try to modify and save the two working files, the errors won't show up on them. Not sure what's going...

EDIT: Never mind, found the issue. It has to do with the "include". In my tsconfig, I have my files set at ["index.ts"], so anything that is not imported by index.ts will not use the tsconfig. So in my case, I imported the new files in index.ts, but as others have mentioned, you can add files through include as well.

[shah-dhaval]

.vscode/settings.json
updating following worked for me
"javascript.implicitProjectConfig.experimentalDecorators": true

[jeanpul]

For my part, I've always this error when I'm creating new files (eg using angular-cli). The error disappear when VSCode refresh the filesystem. You can force it by doing > File: Refresh Explorer

[richardstutely]

Just to bring everything together:

Step 1 from @offg777
Open your VSCode workspace, click the SETTINGS cog on the bottom left corner, choose: SETTINGS.

===================

A SETTINGS EDITOR will open. On the left are default settings, on the right you can enter USER settings.

STEP 2:

Scroll down through the (white color) TOP LEVEL headings on the left until you come to TYPESCRIPT.

Scroll down through the TYPESCRIPT settings until you find the following entry:

  "javascript.implicitProjectConfig.experimentalDecorators": false

COPY this entry into USER SETTINGS on the right, and change "false" to "true" - so your USER SETTINGS now include the following entry:

"javascript.implicitProjectConfig.experimentalDecorators": true

If you have more than one user setting, separate them with commas at the end of the line as follows::

"javascript.implicitProjectConfig.experimentalDecorators": true,
.... next user setting

[JacobWeisenburger]

Ok. That helps a lot. Thanks

[Uzairrrr]

Create tsconfig.json file in the root directory of your project and include the following options.
{
"compilerOptions": {
"experimentalDecorators": true,
"allowJs": true
}

[tomlaigna]

Pulled my hair with this for a while. My problem was that i had the "src" folder open instead of the root folder in VSCode. Btw my tsconfig.json has "experimentalDecorators": true,.

[sonphnt]

I had the same problem with Visual Studio 2017. Have tried many solutions here but did not work. How to fix this in VS 2017 instead of Visual Studio Code. Thanks

[Trapulo]

same problem on VS 2017, starting from a few days.

[vankooch]

Same problem here on mac and typescript 2.9.2

[mhegazy]

For similar reports, first please ensure your tsconfig.json/jsconfig.json has no errors, and that the file you see the errors in is already covered by the tsconfig.json/jsconfig.json. To know that you can either:

1. tsc --listFiles --p <path to your tsconfig.json> you should see the file in question in the list of files consumed by the compiler
2. In VSCode use the command platelet to fire >TypeScript: Go to Project Configuration on the file you see the errors in, and that should take you to the configuration file, if the config file has errors, or it does not cover the file in question you should see a File is not part of TypeScript project error in the bottom right corner.
3. In VS, make sure that your tsconfig.json is a. included in your project, and b. its Build Action is set to Content. (Right-click on the tsconfig.json file icon in the solution explorer, select "Properties", set "Build Action" to "Content"). See Developer Community thread for mode details.

If you are still running into problems, please file a new ticket, give us enough context to reproduce the issue locally, ideally a repro project, or a set of steps to recreate the project. Also please share your version of VSCode and version of TypeScript you are using.