node_modules文件夾和Angular2在Visual Studio 2015中的ASP.Net MVC項目中

Question

我按照Angular.io's quickstart中的步驟（Angular組件部分除外）將Angular2安裝到我的新ASP.Net MVC Core項目中。

默認情況下，它以分層方式安裝node_modules，並導致我的web項目未被加載，因爲文件路徑太長。然後我使用「npm重複數據刪除」來壓扁它。

我得到了一些「內部版本號：找不到名稱‘____’」的錯誤（地圖，設置，WeakMap等）

我該如何解決這個問題？

UPDATE

這是我在我的web項目文件。

<?xml version="1.0" encoding="utf-8"?> 
<Project ToolsVersion="14.0" DefaultTargets="Build" xmlns="http://schemas.microsoft.com/developer/msbuild/2003"> 
    <PropertyGroup> 
    <VisualStudioVersion Condition="'$(VisualStudioVersion)' == ''">14.0</VisualStudioVersion> 
    <VSToolsPath Condition="'$(VSToolsPath)' == ''">$(MSBuildExtensionsPath32)\Microsoft\VisualStudio\v$(VisualStudioVersion)</VSToolsPath> 
    </PropertyGroup> 
    <Import Project="$(VSToolsPath)\DNX\Microsoft.DNX.Props" Condition="'$(VSToolsPath)' != ''" /> 
    <PropertyGroup Label="Globals"> 
    <ProjectGuid>3775534b-d08c-45f2-8d5a-4a4f6e91edb9</ProjectGuid> 
    <RootNamespace>MyProject</RootNamespace> 
    <BaseIntermediateOutputPath Condition="'$(BaseIntermediateOutputPath)'=='' ">..\..\artifacts\obj\$(MSBuildProjectName)</BaseIntermediateOutputPath> 
    <OutputPath Condition="'$(OutputPath)'=='' ">..\..\artifacts\bin\$(MSBuildProjectName)\</OutputPath> 
    <SccProjectName>SAK</SccProjectName> 
    <SccProvider>SAK</SccProvider> 
    <SccAuxPath>SAK</SccAuxPath> 
    <SccLocalPath>SAK</SccLocalPath> 
    </PropertyGroup> 
    <PropertyGroup> 
    <SchemaVersion>2.0</SchemaVersion> 
    </PropertyGroup> 
<PropertyGroup Condition="'$(Configuration)' == 'Debug'"> 
    <TypeScriptTarget>ES5</TypeScriptTarget> 
    <TypeScriptJSXEmit>None</TypeScriptJSXEmit> 
    <TypeScriptCompileOnSaveEnabled>True</TypeScriptCompileOnSaveEnabled> 
    <TypeScriptNoImplicitAny>False</TypeScriptNoImplicitAny> 
    <TypeScriptModuleKind>CommonJS</TypeScriptModuleKind> 
    <TypeScriptRemoveComments>False</TypeScriptRemoveComments> 
    <TypeScriptOutFile /> 
    <TypeScriptModuleResolution>NodeJs</TypeScriptModuleResolution> 
    <TypeScriptOutDir /> 
    <TypeScriptGeneratesDeclarations>False</TypeScriptGeneratesDeclarations> 
    <TypeScriptNoEmitOnError>True</TypeScriptNoEmitOnError> 
    <TypeScriptSourceMap>True</TypeScriptSourceMap> 
    <TypeScriptMapRoot /> 
    <TypeScriptSourceRoot /> 
    <TypeScriptExperimentalDecorators>True</TypeScriptExperimentalDecorators> 
    </PropertyGroup> 
    <Target Name="FixTsBuildConfiguration" BeforeTargets="CompileTypeScript" > 
    <PropertyGroup> 
     <TypeScriptBuildConfigurations>$(TypeScriptBuildConfigurations.Replace("--moduleResolution NodeJs", "--moduleResolution node"))</TypeScriptBuildConfigurations> 
    </PropertyGroup> 
    </Target> 
    <ItemGroup> 
    <DnxInvisibleContent Include="bower.json" /> 
    <DnxInvisibleContent Include=".bowerrc" /> 
    <DnxInvisibleContent Include="package.json" /> 
    <DnxInvisibleFolder Include="wwwroot\bower_components\" /> 
    <DnxInvisibleFolder Include="wwwroot\node_modules\" /> 
    </ItemGroup> 
    <Import Project="$(VSToolsPath)\DNX\Microsoft.DNX.targets" Condition="'$(VSToolsPath)' != ''" /> 
</Project> 

Answer 1

此設置爲我工作的ASP.NET項目中...

tsconfig.json

"compilerOptions": { 
"emitDecoratorMetadata": true, 
"experimentalDecorators": true, 
"module": "commonjs", 
"moduleResolution": "node", 
"noImplicitAny": false, 
"removeComments": false, 
"sourceMap": true, 
"target": "es5", 
"outDir": "./dist" 
}, 
"exclude": [ 
     "node_modules" 
     ] 

的index.html

<script> 
//configure system loader 
    System.config({ 
     defaultJSExtensions: true, 
     paths: { 
      '*': 'node_modules/*', 
      'dist/*': 'dist/*' 
     } 
    }); 
</script> 

並確保whenev如果您在打字稿文件中引用模塊，則只使用包的名稱，例如

import {Component, OnInit, Inject} from 'angular2/core';