Visual Studio not compiling TypeScript

Question

I have a Visual Studio project with a structure like so:

My tsconfig.json looks like:

{
  "compilerOptions": {
    "noImplicitAny": false,
    "noEmitOnError": true,
    "removeComments": false,
    "sourceMap": true,
    "target": "es5",
    "outDir": "../wwwroot/"
  },
  "exclude": [
    "node_modules",
    "wwwroot"
  ]
}

However, VS isn't compiling the app.ts into the wwwroot folder.

What am I missing?

Did you check "Compile TypeScript on build" in the Project Properties -> Build? — Marcin Zablocki
– Marcin Zablocki, Commented May 16, 2016 at 20:07
It is... I didn't build! I thought it was continuous rather than on build. Thanks for the pointer. — BanksySan
– BanksySan, Commented May 16, 2016 at 20:19
@BanksySan you might be looking for "Compile on save" in Properties > TypeScript Build — David Sherret
– David Sherret, Commented May 16, 2016 at 20:26

ericbowden · Accepted Answer · 2017-02-03 01:09:41Z

18

Try adding "compileOnSave": true to your tsconfig.json:

{
    "compilerOptions": {
        "noImplicitAny": false,
        "noEmitOnError": true,
        "removeComments": false,
        "sourceMap": true,
        "target": "es5",
        "outDir": "../wwwroot/"
     },
     "exclude": [
        "node_modules",
        "wwwroot"
    ],
    "compileOnSave": true
}

It should compile every time you save now.

answered Feb 3, 2017 at 1:09

ericbowden

2,2131 gold badge20 silver badges22 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

Martin Capodici Over a year ago

That did it for me.

Digitrance Over a year ago

Worked for me too! Note: compilerOptions.noEmit must be removed or set to false for this solution to work.

David Pine · Accepted Answer · 2018-04-10 01:02:29Z

8

From within Visual Studio, Project > Properties > Build > ensure that the "Compile TypeScript on build" is checked:

Also, in your tsconfig.json you should specify a rootDir so that TypeScript knows where to look for *.ts files it should compile:

{
  "compileOnSave": true,
  "compilerOptions": {
    "noImplicitAny": false,
    "noEmitOnError": true,
    "removeComments": false,
    "sourceMap": true,
    "target": "es5",
    "outDir": "../wwwroot/",
    "rootDir": "../wwwroot/"
  },
  "exclude": [
    "node_modules",
    "wwwroot"
  ]
}

The details are called out on the TypeScript page here and here.

Don't forget to actually build it. It isn't a file watcher scenario.

edited Apr 10, 2018 at 1:02

answered May 17, 2016 at 11:35

David Pine

24.6k11 gold badges82 silver badges113 bronze badges

4 Comments

BanksySan Over a year ago

Cheers David. It turned out the missing peice of my puzzle was that I didn't realise that it was triggered on build, I thought it was constantly watching the files.

Vern Jensen Over a year ago

Does Visual Studio actually use the settings in tsconfig.json?

David Pine Over a year ago

@VernJensen absolutely, if they are omitted then they rely on defaults.

KVM Over a year ago

I don't have this option in my asp.net project

kkuilla · Accepted Answer · 2021-01-29 11:34:21Z

It could be a syntax error in the typescript file.

My solution was to roll back the .ts file until it compiled (i.e. the timestamps of typescript and javascript files were identical) and start to change the .ts file from there. If the timestamps are not identical after compiling the .ts file, then we know it is probably a syntax error. I had to compile after every change and check the timestamp.

The syntax error was unfortunately not shown anywhere so I had to rely on timestamps to determine whether a file was compiled or not.

I had Compile-on-save enabled in Visual Studio 2019

Below is an screenshot of FileExplorer where the .ts has an error. Notice the difference in timestamps.

Below is an screenshot of FileExplorer where the .ts file is complied into `javascript successfully. Motice the timestamps are identical.

KramFfud · Accepted Answer · 2022-11-28 20:27:46Z

1

In VS 2022, changing the .ts file's Property -> Build Action from "None" to "TypeScript File" did the trick for me.

answered Nov 28, 2022 at 20:27

KramFfud

2391 gold badge3 silver badges7 bronze badges

1 Comment

Roto Over a year ago

I've also had Chrome hold on to my old .js file even though it did recompile with build. So make sure you hit crtl+F5 to refresh your client side files in your browser.

Collectives™ on Stack Overflow

Visual Studio not compiling TypeScript

4 Answers 4

2 Comments

4 Comments

Comments

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

4 Answers 4

2 Comments

4 Comments

Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related