ASP.Net MVC Angular 2 最終版

有沒有人用 ASP.Net MVC 嘗試過 Angular 2 RC Final？

我在使用 ASP.Net MVC 配置 Angular 2 RC 6 時遇到問題，直到 beta 17 一切正常。

具有以下配置的 package.json 似乎不起作用：

"dependencies": {
   "@angular/common": "2.0.0-rc.6",
   "@angular/compiler": "2.0.0-rc.6",
   "@angular/core": "2.0.0-rc.6",
   "@angular/forms": "0.3.0",
   "@angular/http": "2.0.0-rc.6",
   "@angular/platform-browser": "2.0.0-rc.6",
   "@angular/platform-browser-dynamic": "2.0.0-rc.6",
   "@angular/router": "3.0.0-rc.1",

   "systemjs": "0.19.27",
   "core-js": "^2.4.0",
   "reflect-metadata": "^0.1.3",
   "rxjs": "5.0.0-beta.6",
   "zone.js": "^0.6.12",

 },

恢復包會在輸出視窗中顯示以下輸出：

====Executing command 'npm install'====


npm WARN package.json @ No description
npm WARN package.json @ No repository field.
npm WARN package.json @ No README data
npm http GET http://registry.npmjs.org/systemjs
npm http GET http://registry.npmjs.org/angular/compiler
npm http GET http://registry.npmjs.org/angular/core
npm http GET http://registry.npmjs.org/angular/http
npm http GET http://registry.npmjs.org/angular/platform-browser
npm http GET http://registry.npmjs.org/angular/platform-browser-dynamic
npm http GET http://registry.npmjs.org/angular/router
npm http GET http://registry.npmjs.org/angular/router-deprecated
npm http GET http://registry.npmjs.org/angular/common
npm http GET http://registry.npmjs.org/reflect-metadata
npm http GET http://registry.npmjs.org/angular/upgrade
npm http 304 http://registry.npmjs.org/systemjs
npm http 404 http://registry.npmjs.org/angular/platform-browser
npm http 404 http://registry.npmjs.org/angular/core
npm ERR! 404 Not Found
npm ERR! 404 
npm ERR! 404 'angular/platform-browser' is not in the npm registry.
npm ERR! 404 You should bug the author to publish it
npm ERR! 404 
npm ERR! 404 Note that you can also install from a
npm ERR! 404 tarball, folder, or http url, or git url.
npm ERR! System Windows_NT 6.2.9200
npm ERR! command "C:\\Program Files (x86)\\Microsoft Visual Studio 14.0\\Common7\\IDE\\Extensions\\Microsoft\\Web Tools\\External\\\\node\\node" "C:\\Program Files (x86)\\Microsoft Visual Studio 14.0\\Common7\\IDE\\Extensions\\Microsoft\\Web Tools\\External\\npm\\node_modules\\npm\\bin\\npm-cli.js" "install"
npm ERR! cwd D:\User\MyProject-MVC6\src\MyProject
npm ERR! node -v v0.10.31
npm ERR! npm -v 1.4.9
npm ERR! code E404
npm http 404 http://registry.npmjs.org/angular/http
npm http 404 http://registry.npmjs.org/angular/compiler
npm http 404 http://registry.npmjs.org/angular/router-deprecated
npm http 404 http://registry.npmjs.org/angular/router
npm http 404 http://registry.npmjs.org/angular/platform-browser-dynamic
npm http 304 http://registry.npmjs.org/reflect-metadata
npm http 404 http://registry.npmjs.org/angular/common
npm http 404 http://registry.npmjs.org/angular/upgrade
npm

====npm command completed with exit code 1====

非常感謝使用 Angular2 RC 6 和 ASP.Net MVC 的分步說明。

修好了！如果有人仍在努力讓 Angular 2 Final 與 ASP.Net MVC 一起工作，請分享詳細資訊

讓我感謝巴里和白蘭度在不同方面的指導。

我可以按照以下步驟修復上述錯誤：

Visual Studio 2015附帶了一個非常舊的 npm 版本。因此，您需要做的第一件事是從https://nodejs.org/en/下載並安裝最新版本的 Node （我安裝了 v6.1.0，目前最新版本）。

安裝後，您需要告訴 Visual Studio 使用最新版本的 node 而不是嵌入的舊版本。為此，請執行以下步驟：

1. 在 Visual Studio 中，從頂部菜單轉到工具 > 選項
2. 展開對話框中顯示的項目和解決方案節點
3. 選擇外部網路工具
4. 添加一個指向 C:\Program Files\nodejs 的新條目（或指向您安裝 nodejs 的位置）
5. 將其移至列表頂部。

6. 重新啟動 Visual Studio 並恢復 npm 包。

這應該修復了上述錯誤，但是現在如果您嘗試編譯項目，您可能會看到很多錯誤，主要是由於缺少類型定義，例如：

嚴重性程式碼描述項目文件行抑制狀態

錯誤 TS6053 建構：找不到文件 /node_modules/angular2/ts/typings/jasmine/jasmine.d.ts'

擴充中的模組名稱無效，找不到模組“../../Observable”。

TypeScript 虛擬項目 node_modules\rxjs\add\operator\zip.d.ts

“可觀察”類型上不存在屬性“地圖”。

要修復上述錯誤，您只需在 main.ts 或 bootstrap.ts 頂部添加以下連結：

///<reference path="./../typings/browser/ambient/es6-shim/index.d.ts"/>

這應該可以解決上述打字錯誤。

使用 RC，Angular 團隊將所有組件作為單獨的文件提供。因此，在過去，如果您能夠將 Angular 包作為打封包件 angular2.dev.js（或 min 文件）包含在索引文件中，那麼現在這將不起作用。所需的組件需要包含在您的應用所需的索引中。您可以使用 systemjs.config.js 來包含添加依賴項。我強烈建議您閱讀官方快速入門指南，特別是本節：

連結：https ://angular.io/guide/quickstart

即使按照上述步驟進行了正確配置，當您執行應用程序時，您可能會看到 404，因為缺少 angular 文件。

原因是，預設情況下，ASP.Net 5 在 /wwwroot/node_modules/ 文件夾中查找 Angular 依賴項。由於 node_modules 位於項目根文件夾中而不是 wwwroot 文件夾中，因此瀏覽器返回 404（未找到錯誤）。因此，將 @angular 文件夾從 node_modules 文件夾移動到 wwwroot 應該可以解決問題。

地圖錯誤

在某些情況下，升級 TypeScript 版本也會修復地圖錯誤：

嘗試按照以下步驟升級到 TypeScript 2： - 在 Visual Studio 中點擊工具 > 擴展和更新 - 從對話框左側顯示的列表中選擇線上 - 搜尋 TypeScript - 從搜尋結果中安裝適用於 Microsoft Visual Studio 2015 的 TypeScript 2.0 Beta。 - 重新啟動電腦，希望它能修復所有地圖錯誤

希望這可以幫助。

引用自：https://stackoverflow.com/questions/37076594