Roj Beraña Roj Beraña - 5 months ago 70
AngularJS Question

cannot find module 'angular2/core'

enter image description here

These red squiggly lines say

cannot find module 'angular2/core'
,
cannot find module 'angular2/router'
,
cannot find module 'angular2/http'
.
I checked other posts in SO but it seems they have no appropriate answer.

I also added a reference to the
d.ts
files as seen below but still not working.
enter image description here

Other posts say that I need to configure something in the
tsconfig.json
file but I am using Visual Studio and I see no need to use the tscompiler suggested by the angular team because Visual Studio should be able to compile ts files automatically.

Am I missing something?

Is the
tsconfig.json
still required even if you use Visual Studio?


How do I get rid of these squiggly lines?

Thanks!

(I am using Visual Studio 2015 and latest Typescript engine)

UPDATE:
I am not sure what exactly is the npm package manager. But I have a pre-built
package.json
file that was created when the project was created. I use this file for installing npm packages.
enter image description here

Answer

For ASP.NET 5.0 applications in VS 2015, configuring typescript is a bit challenging.

Until the tooling around typescript improves, you can configure typescript manually:

Step 1: Right-click project, and Unload Project 
Step 2: Right-click the unloaded project, and Edit the .xproj file
Step 3: Add a PropertyGroup node, under the Project node:

  <PropertyGroup Condition="'$(Configuration)' == 'Debug'">
    <TypeScriptTarget>ES5</TypeScriptTarget>
    <TypeScriptJSXEmit>None</TypeScriptJSXEmit>
    <TypeScriptCompileOnSaveEnabled>True</TypeScriptCompileOnSaveEnabled>
    <TypeScriptNoImplicitAny>False</TypeScriptNoImplicitAny>
    <TypeScriptModuleKind>CommonJS</TypeScriptModuleKind>
    <TypeScriptRemoveComments>False</TypeScriptRemoveComments>
    <TypeScriptOutFile />
    <TypeScriptOutDir />
    <TypeScriptGeneratesDeclarations>False</TypeScriptGeneratesDeclarations>
    <TypeScriptNoEmitOnError>True</TypeScriptNoEmitOnError>
    <TypeScriptSourceMap>True</TypeScriptSourceMap>
    <TypeScriptMapRoot />
    <TypeScriptSourceRoot />
    <TypeScriptExperimentalDecorators>True</TypeScriptExperimentalDecorators>
  </PropertyGroup>

Step 4: Right-click the unloaded project and Reload Project
Step 5: Re-build project

If you are still encountering the error where it cannot find the module, exit visual studio and reload the solution.

Comments