4

I am using this guide to build a starter angular2 app.

When I try to build it complains about bad options and I noticed it building with typescript 1.8 instead of typescript 2.x. I have installed Typescript@2.0 via npm. npm install -g typescript@2.0. I have set the VS Options to load .\node_modules\.bin first in External Web Tools. I have a tsconfig.json file. I can see it still trying to compile with typescript 1.8. Any ideas what to do to fix this? I have followed the guide twice. 

1>Target "PreComputeCompileTypeScriptWithTSConfig" in file "C:\Program Files (x86)\MSBuild\Microsoft\VisualStudio\v14.0\TypeScript\Microsoft.TypeScript.targets" from project "C:\Users\111111\Documents\Visual Studio 2015\Projects\TestAngular\TestAngular\TestAngular.csproj" (target "CompileTypeScriptWithTSConfig" depends on it):
1>Using "VsTsc" task from assembly "C:\Program Files (x86)\MSBuild\Microsoft\VisualStudio\v14.0\TypeScript\TypeScript.tasks.dll".
1>Task "VsTsc"
1>  C:\Program Files (x86)\Microsoft SDKs\TypeScript\1.8\tsc.exe --project "C:\Users\111111\Documents\Visual Studio 2015\Projects\TestAngular\TestAngular\tsconfig.json" --listEmittedFiles
1>Done executing task "VsTsc".
1>Done building target "PreComputeCompileTypeScriptWithTSConfig" in project "TestAngular.csproj".
1>Target "CompileTypeScriptWithTSConfig" in file "C:\Program Files (x86)\MSBuild\Microsoft\VisualStudio\v14.0\TypeScript\Microsoft.TypeScript.targets" from project "C:\Users\111111\Documents\Visual Studio 2015\Projects\TestAngular\TestAngular\TestAngular.csproj" (target "Compile" depends on it):
1>Task "VsTsc"
1>  C:\Program Files (x86)\Microsoft SDKs\TypeScript\1.8\tsc.exe --project "C:\Users\111111\Documents\Visual Studio 2015\Projects\TestAngular\TestAngular\tsconfig.json" --listEmittedFiles
1>  C:\Users\111111\Documents\Visual Studio 2015\Projects\TestAngular\TestAngular\error TS5023:Build:Unknown compiler option 'listemittedfiles'.
1>C:\Program Files (x86)\MSBuild\Microsoft\VisualStudio\v14.0\TypeScript\Microsoft.TypeScript.targets(214,5): error MSB6006: "tsc.exe" exited with code 1.
1>Done executing task "VsTsc" -- FAILED.
1>Done building target "CompileTypeScriptWithTSConfig" in project "TestAngular.csproj" -- FAILED.

tsconfig.json

{
  "compilerOptions": {
    "target": "es5",
    "module": "commonjs",
    "moduleResolution": "node",
    "sourceMap": true,
    "emitDecoratorMetadata": true,
    "experimentalDecorators": true,
    "lib": [ "es2015", "dom" ],
    "noImplicitAny": true,
    "suppressImplicitAnyIndexErrors": true
  }
}

I have done nothing special in my .csproj. I tried setting <TypeScriptToolsVersion>2.0</TypeScriptToolsVersion> but that does nothing.

How do I ensure that the VsTsc task is using typescript 2? Also in External Web Tools I would love to know where .\node_modules\.bin refers too? It doesn't seem to be C:\Users\111111\Documents\Visual Studio 2015\Projects\TestAngular\TestAngular\node_modules\.bin. Npm installed typescript to C:\Users\111111\AppData\Roaming\npm.

Additional info: I did find this answer. Build:Unknown compiler option 'listemittedfiles'

It explains the workaround (don't install via npm, install via the VS installation). But my still question is why the External Web Tools listing possibly does nothing? Or how it even modifies which version of Typescript.

Community
  • 1
  • 1
kosmos
  • 365
  • 7
  • 21
  • Please check if you install all the requirements, (Install Node.js,Install Visual Studio 2015 Update 3, Install TypeScript 2 for Visual Studio 2015), Based on the requirements and the steps it works, I also install TypeScript via npm command, and modify the setting named TypeScriptToolsVersion to 2.0, here is the sample(https://1drv.ms/u/s!AlvaNEnglADDfqpo40tZnw_yIuw), please compare the csproj file with yours. in addition, please check if there has a folder named 2.1 in C:\Program Files (x86)\Microsoft SDKs\TypeScript – Zhanglong Wu - MSFT Dec 29 '16 at 01:47
  • I know for sure that 2.1 didnt exist in `C:\Program Files (x86)\Microsoft SDKs\TypeScript` before I ran the VS Typescript installer. Does `npm install -g typescript@2.0` do that? – kosmos Dec 29 '16 at 15:21
  • As trungk18 said, npm install -g typescript@2.0, it will be installed globally in 'C:\Users\username\AppData\Roaming\npm, which have not tsc.exe. it does not install typescript in C:\Program Files (x86)\Microsoft SDKs\TypeScript, which cause the issue. when you build the project, msbuild find related tsc.exe via property, which find the tsc.exe from C:\Program Files (x86)\Microsoft SDKs\TypeScript. – Zhanglong Wu - MSFT Dec 30 '16 at 09:17

4 Answers4

4

Add the following to TestAngular.csproj:

<PropertyGroup>
    <TscToolPath>PATH TO DESIRED tsc.exe, NOT INCLUDING THE tsc.exe</TscToolPath>
</PropertyGroup>
weir
  • 4,521
  • 2
  • 29
  • 42
  • I wish something like this was integrated into the External Web Tools, but this is the best answer as of this time. It is the best for finding the solution I want, which is get VS to use tsc.exe where I want it to. – kosmos Jan 10 '17 at 14:54
3

External Web Tools

For double check, did you move the $(PATH) entry above the $(DevEnvDir) entries as my image below?

.\node_modules\.bin is refer to your node_module folder in the same level with package.json in your project. It means the package will be installed locally into this folder only.

Because you run npm install -g typescript@2.0, it will be installed globally in 'C:\Users\username\AppData\Roaming\npm, not into your project folder.

See the different here: Locally installed versus globally installed NPM modules

Community
  • 1
  • 1
trungk18
  • 19,744
  • 8
  • 48
  • 83
  • Yup, I have my tools setup just as in he picture. Also i did run the global install for typescript, but also its a part of me pacakge.json. `"devDependencies": { "typescript": "~2.0.10"` – kosmos Dec 28 '16 at 13:11
  • It's quite weird, can you update your tsconfig.json into your question? – trungk18 Dec 28 '16 at 15:43
  • done. It determines the TS version before thats even used I think so I wouldn't think its relevant. – kosmos Dec 28 '16 at 18:01
  • did you solve it? I used the same config, typescript 2.0 and visual studio 2015 but haven't got your error :( – trungk18 Dec 29 '16 at 16:29
  • As mentioned in post I linked in the "Additional Info" section, "this seems to be a known issue on some VS2015 installations that might have become "broken" due to the frequent updates released lately" [link](https://github.com/PacktPublishing/ASPdotNET-Core-and-Angular-2/issues/1). I had VS2013, then VS2015 Update1, then VS2015 Update3. None of those included typescript2. MSBUILD uses the version provided in the .target files, and your csproj can override those properties. So installing typescript 2.0 via npm doesnt seem to support injecting into that MSBUILD process, as I would have thought. – kosmos Dec 29 '16 at 18:14
  • Give the bounty for this question since I am not able to answer it :d – trungk18 Jan 03 '17 at 09:16
0

plz check this out how to setup angular2 + typescript in VS2015 community (update 3)

https://github.com/MohtishamZubair/AgentDistribution/wiki/Setting-up-AngularJS2-in-VS2015-in-MVC5

Mean while in mine setting $(path) is second last

Mohtisham Zubair
  • 723
  • 5
  • 15
  • You don't ve to make change in VS settings just follow mine article. Even you don't need for node.js server @trungk18 do check for the duplicate entries in csproj files as well. – Mohtisham Zubair Jan 09 '17 at 13:27
  • This is a known workaround as stated in the original question. The thing that is needed is to get VS to use npm installed Typescript2, and not need the VS extensions. – kosmos Jan 09 '17 at 15:08
0

I believe VS2015 works a bit differently than other editors.

Optional: Uninstall previous version "Typescript Tools for Microsoft Visual Studio 2015" under Programs and Features.

Download and install the latest "Typescript Tools for Microsoft Visual Studio 2015" on https://www.typescriptlang.org/#download-links.

Hope that fixes your issue.

penleychan
  • 5,370
  • 1
  • 17
  • 28
  • Again, This is a known workaround as stated in the original question. The thing that is needed is to get VS to use npm installed Typescript2, and **not** need the VS extensions. – kosmos Jan 09 '17 at 17:17