squadwuschel
squadwuschel

Reputation: 3428

VS Code TypeScript SourceMap creation

I've installed newest Version of VS Code and I try to compile a "app.ts" file so that I get a "app.js" and "app.js.map". But when I compile the project it only creates the "app.js" file and no mapping file.

in my root folder I've a ".vscode" folder with the following "tsconfig.json"

{
 "compilerOptions": {
     "target": "es6",
     "module": "amd",
     "sourceMap": true 
}

and the following the "tasks.json" file

{
   "version": "0.1.0",

   // The command is tsc. Assumes that tsc has been installed using npm install -g typescript
   "command": "tsc",

   // The command is a shell script
   "isShellCommand": true,

   // Show the output window only if unrecognized errors occur.
   "showOutput": "silent",

   // args is the HelloWorld program to compile.
   "args": ["app.ts"],

   // use the standard tsc problem matcher to find compile problems
   // in the output.
   "problemMatcher": "$tsc"
   }
}

and in the root directory I've my "app.ts" file

module App {
    export class Person {
        constructor(public name: string) { }

        public log(showLog: boolean): void {
            if (showLog) {
                console.log("Der Name des Nutzers ist: " + this.name)
            }
        }
    }
}

var person = new App.Person("Hallo Welt");
person.log(true);

but when I compile it with ctrl+shift+b it only creates the app.js file and no mapping.

Update: I've also tried to modify the "tasks.json"

{
    "version": "0.1.0",

    // The command is tsc. Assumes that tsc has been installed using npm install -g typescript
    "command": "tsc",

    // The command is a shell script
    "isShellCommand": true,

    // Show the output window only if unrecognized errors occur.
    "showOutput": "always",

    // args is the HelloWorld program to compile.
    "args": [" --sourcemap app.ts"],

    // use the standard tsc problem matcher to find compile problems
    // in the output.
    "problemMatcher": "$tsc"
}

with --sourcemap Argument but it doesn't work. But when I use the command promt with the following command:

c:\Temp\vsCode\tsc --sourcemap app.ts

then everything works fine and the mapping files are created.

Upvotes: 1

Views: 695

Answers (2)

squadwuschel
squadwuschel

Reputation: 3428

The Solution: modify the args, its an array with strings, seems to be one solution

"args": ["--sourcemap", "app.ts"]

alternate Solution, when you want to use your tsconfig.json for compile options you need to use this task.json entry:

{
    "version": "0.1.0",

    // The command is tsc. Assumes that tsc has been installed using npm install -g typescript
    "command": "tsc",

    // The command is a shell script
    "isShellCommand": true,

    // Show the output window only if unrecognized errors occur.
    "showOutput": "silent",

    "windows": {
        "command": "tsc",
        "isShellCommand": true
    },

    // Tell the tsc compiler to use the tsconfig.json from the open folder.
    "args": ["-p", "."],

    // use the standard tsc problem matcher to find compile problems
    // in the output.
    "problemMatcher": "$tsc"
}

I've modified the original post and added the "windows" Settings, without this settings it seems that vs code uses a old typescript version 1.0.3.0 but I don't know why.

Solution Number 3 - Try to look if the Windows PATH variable don't has a entry to TypeScript Version 1.0 - remove this entry and add a entry to the newest version

Upvotes: 1

Amid
Amid

Reputation: 22382

I think you should have tsconfig.json in the root folder (see tsconfig). Not in the .vscode folder.

.vscode folder is ment for storing config files that are specific to visual sudio code (launch.json, settings.json, tasks.json).

Upvotes: 2

Related Questions