找不到模塊'angular2 / core'

Question

這些紅色波浪線表示cannot find module 'angular2/core' ， cannot find module 'angular2/router' ， cannot find module 'angular2/http' 。 我查了SO中的其他帖子，但似乎沒有合適的答案。

我還添加了對d.ts文件的引用，如下所示，但仍無法正常工作。

其他帖子說我需要在tsconfig.json文件中配置一些東西，但我使用的是Visual Studio，我認為不需要使用angular團隊建議的tscompiler，因為Visual Studio應該能夠自動編譯ts文件。

我錯過了什么嗎？

即使您使用Visual Studio，仍然需要tsconfig.json嗎？

我如何擺脫這些波浪線？

謝謝！

（我使用的是Visual Studio 2015和最新的Typescript引擎）

更新：我不確定npm包管理器究竟是什么。 但是我有一個在項目創建時創建的預先構建的package.json文件。 我用這個文件來安裝npm包。

Answer 1

對於VS 2015中的ASP.NET 5.0應用程序，配置typescript有點挑戰性。

在改進打字稿的工具之前，您可以手動配置打字稿：

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

如果您仍然遇到無法找到模塊的錯誤，請退出visual studio並重新加載解決方案。

Answer 2

這是我的工作設置：

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

將此應用到Web項目后重新啟動Visual Studio。

Answer 3

對於VS2015，請轉到工具 - >選項 - >文本編輯器 - > TypeScript - >項目 - >常規，然后勾選“自動編譯不屬於項目的TypeScript文件”，然后選擇“為模塊使用CommonJS代碼生成”。

Answer 4

這就是我在VS2015中修復問題的方法：

• 打開項目屬性窗口
• 導航到TypeScript Build選項卡
• 選擇CommonJS作為模塊系統，如下圖所示

Answer 5

我也遇到了這個錯誤，對我有用的是，卸載項目並檢查.csproj文件。 我發現這個片段已添加到那里 -

  <ItemGroup>
    <None Remove="ClientApp\components\componentname\componentname.ts" />
  </ItemGroup>

刪除此代碼，保存csproj然后重新加載項目工作。 希望這可以幫助！

Answer 6

最簡單的安裝方法是使用npm包管理器，因為angular2現在隨附輸入。 您的編輯將識別所有導入位置......

Answer 7

This has to be done for both 'Debug' and 'Release' then only it works in VS 2013. Like below..

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

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

Answer 8

我在安裝離子2時遇到了這個問題 - 我安裝了所有軟件包（package.json更新）並將我的npm更新為v3。 這解決了它。

Answer 9

使用Mads Kristensen的ASP.NET Core Angular 2入門應用程序模板進行開發。 我在使用Typescript文件啟動一個新目錄時遇到了類似的問題。

我的解決方案比修改項目文件更簡單。 我剛從ClientApp文件夾中復制了tsconfig.json，其中所有的打字稿文件都放在我的新文件夾中。

Answer 10

只需右鍵單擊“ package.json ”

並在安裝Packages之后選擇“ Restore Packages ”構建它...您的問題已解決

Answer 11

這是一個有趣的問題，除了上面提到的原因和解決方案之外，可以在以下場景中得到此錯誤。

1. NPM（節點包管理器）未安裝在計算機上

   修復：從https://nodejs.org/en/安裝NPM

   

2. 如果在安裝NPM后仍然出現此錯誤，則可能存在NPM配置問題。 請參閱此文章以正確設置NPM配置

Answer 12

1. 在Visual Studio 2015中，轉到“工具”菜單，然后單擊“選項...”。 您將能夠在打開的窗口的左側看到樹結構。
2. 展開“項目和解決方案”，然后選擇“外部Web工具”。 現在將“$（PATH）”條目移到“$（DevEnvDir）”條目上方。
3. 單擊確定。 重新啟動Visual Studio。
4. 現在，右鍵單擊解決方案資源管理器中的“package.json”文件，然后單擊“還原包”。

Answer 13

嗨，當我使用eclplse編輯器時，我遇到了同樣的問題。 我在我的cmd窗口中執行了下面的命令，我已經重啟了我的日食。 它按預期工作。

npm install --save @ angular / core @ angular / compiler @ angular / common @ angular / platform-b​​rowser @ angular / platform-b​​rowser-dynamic rxjs@5.0.0-beta.6 zone.js@0.6.12 @angular /形式

Answer 14

• 嘗試運行npm install命令（將在您的項目中安裝缺少的lib）
• 重新打開您的文件夾/項目

Answer 15

右鍵單擊“ package.json ”，然后選擇Install packages選項，它將打開終端並自動導航到正確的根文件夾，並將安裝所需的依賴項。

package.json列出了項目運行所需的所有依賴項列表。