Typescript: Decorators not allowed in JS even with 'experimentalDecorators' set

[DanielRosenwasser]

1. Create a new folder.
2. Add a tsconfig.json/jsconfig.json.
3. Add "experimentalDecorators": true.
4. Create a new .js file that has a decorated class.

Expected: No error.
Actual: Error that you need to add "experimentalDecorators": true.

[billti]

Hmmm, isn't this exactly what https://github.com/Microsoft/TypeScript/pull/6881 fixed? Maybe a regression (though hard to say, as you didn't mention what build/branch you are using :-p ).

[billti]

p.s. Just tried it with a build from a couple days ago in master, and it works fine with the below tsconfig.json. It gives the error if I change the setting to false (as expected). Please provide a repro (and details on what branch/build) if you are sure you are seeing issues.

{
    "compilerOptions": {
        "experimentalDecorators": true,
        "allowJs": true
    }
}

[mhegazy]

i see this on latest too.

[DanielRosenwasser]

@mhegazy you see the behavior I'm reporting, or are you also saying it works for you?

@billti, @jramsay saw the same issue a few days ago as well. I used the nightly, so Version 1.9.0-dev.20160525-1.0.

[zhengbli]

Cannot repro this either. Talked to @mhegazy, turns out he had an invalid tsconfig when he saw this. Close until a repro can be found.

[akanieski]

I'm working on a TS project that's using gulp (+ aurelia-cli). Even with experimentalDecorators: true I still get red squigglies in VSCode.

{
  "compileOnSave": false,
  "compilerOptions": {
    "sourceMap": true,
    "target": "es5",
    "module": "amd",
    "declaration": false,
    "noImplicitAny": false,
    "removeComments": true,
    "emitDecoratorMetadata": true,
    "experimentalDecorators": true,
    "moduleResolution": "node",
    "lib": ["es2015", "dom"]
  },
  "exclude": [
    "node_modules"
  ],
  "filesGlob": [
    "./src/**/*.ts",
    "./test/**/*.ts",
    "./typings/index.d.ts",
    "./custom_typings/**/*.d.ts"
  ],
  "atom": {
    "rewriteTsconfig": false
  }
}

[akanieski]

I ran into this when I open a root folder that contains TS project for client and TS project for server (File-> Open Folder .. /root ). The root has no tsconfig file. VSCode does not respect the tsconfig in each respective project folder ( /root/server/tsconfig.json and /root/client/tsconfig.json ). It is expecting a tsconfig to be in the root of the folder opened in VSCode ( /root/tsconfig.json ).

When I open another instance of VSCode and open the /root/client or /root/server folder the decorator warning goes away, as it should.

Is this by design? I'm not sure i'd expect it to find the nearest tsconfig.json in local folder or above.

I hope I'm making sense :-P

[zhengbli]

@akanieski it shouldn't be the case, the tsconfig file in the same folder should be respected regardless where you open as root in VSCode. Can you provide a small sample of the issue for reproing? I tried on my machine but I didn't see it happen. Also with your tsconfig.json content, I didn't get the error for the decorators. What version of VSCode / TypeScript are you using?

[akanieski]

@zhengbli : Sure. Checkout the following repo:

https://github.com/akanieski/decorator-issue

[akanieski]

TS Version 2.1.0-dev.20160724

[zhengbli]

That doesn't seem to be the case for me:

Did you do anything else other than open the files, like switch git branches etc.?
I am using the same TS version.

[akanieski]

Nope. Let me try from another pc. Perhaps I have something interfering.

[juliusl]

Not sure if this helps but.. if I remove this line:

"lib": ["es2015", "dom"]

reopen the file and wait a second the error goes away.

[jorgeas80]

Having this problem right now. VSCode 1.5.3 with Typescript 2.0.3. Running in a Ubuntu 16.04 box. Tried all the suggestions in this thread.

My tsconfig.json

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

[robinchesterman]

I had this problem in one project, but not in another, both using TS 2.0.3 and VS Code 1.5.3. The tsconfig that wasn't working (ignoring filesGlob and exclude):

{ "compilerOptions": { "target": "es5", "module": "commonjs", "emitDecoratorMetadata": true, "experimentalDecorators": true, "sourceMap": true, "moduleResolution": "node", "allowJs": true } }

And the one that does:

"compileOnSave": false, "compilerOptions": { "sourceMap": true, "target": "es5", "module": "amd", "declaration": false, "noImplicitAny": false, "removeComments": true, "emitDecoratorMetadata": true, "experimentalDecorators": true, "moduleResolution": "node", "lib": ["es2015", "dom"] },

I copied over the one that worked into the other project, and they both work. I tried swapping out every single option looking for a hint has to what might stop the experimentalDecorators flag being honoured, but with no luck. So I have it working, but I have no idea why.

[billti]

You have allowJs to true in the first one. This should be giving you an error when you try to compile that any .js files will overwrite themselves. You'd need to either specify "noEmit": true or "outDir": "../someOtherFolderNotInTheCompilation" for this to be a valid configuration.

[anhtuank7c]

@billti Thank. It's work for me.

This is tsconfig.json in my React Native project:

{
    "compilerOptions": {
        "experimentalDecorators": true,
        "allowJs": true
    }
}

[cornelius-k]

In atom I tried @anhtuank7c suggestion and replaced my tsconfig with

{ "compilerOptions": { "experimentalDecorators": true, "allowJs": true } }

which fixed the issue, then I tried reverting to my original config that I need that was causing the issue and the issue no longer occurs. Great!

[omencat]

Confirmed the two compilerOptions settings resolved the warnings. My original tsconfig.json file had those two settings, but a bunch of other settings. After adding settings back one at a time, It appears the conflict was the following:

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

I ended up replacing the include with exclude instead.

  "exclude": [
    "node_modules"
  ]

[bofcarbon1]

jsconfig.json

{
"compilerOptions": {
"experimentalDecorators": true
}
}

When using VS Code and placing the jsconfig.json file in the root directory of your project my warnings went away.
In my case I'm learning React and there aren't that many TypeScript tutorial versions
around.

[steph643]

Same issue here. I've tried the solutions proposed above, but the warning is still there (VSCode 1.21.1 under Windows).

My jsconfig.json file:

{
    "compilerOptions": { 
        "experimentalDecorators": true
    },
    "exclude": [
        "node_modules",
        "**/node_modules/*"
    ]
}

Same thing with a tsconfig.json file:

{
    "compilerOptions": { 
        "experimentalDecorators": true,     
        "allowJs": true
    },
    "exclude": [
        "node_modules",
        "**/node_modules/*"
    ]
}

[josecolella]

I followed the solutions but I'm still getting a Declaration expected warning from vscode.
Here is a snippet from the compilerOptions of my tsconfig.json
"compilerOptions": { "noImplicitAny": true, "removeComments": true, "preserveConstEnums": true, "experimentalDecorators": true, "emitDecoratorMetadata": true, "allowJs": true,