ASP.Net MVC Angular 2 Финал

Кто-нибудь пробовал Angular 2 RC Final с ASP.Net MVC?

У меня возникли проблемы с настройкой Angular 2 RC 6 с ASP.Net MVC, до бета-тестирования 17 все отлично работало.

Пакет .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 будут высоко оценены.

Ответы

Ответ 1

Получил это исправлено! разделяя детали, если кто-то все еще пытается получить Angular 2 Окончательная работа с ASP.Net MVC

Позвольте поблагодарить Barry и Brando за их руководство в разных точках.

Я смог исправить вышеуказанные ошибки, выполнив следующие шаги:

Visual Studio 2015 поставляется с очень старой версией npm. Поэтому самое первое, что вам нужно сделать, это загрузить и установить последнюю версию Node из https://nodejs.org/en/ (я установил v6.1.0, текущий последний).

После установки вы должны сообщить Visual Studio использовать последнюю версию Node вместо старой версии. Для этого выполните следующие шаги:

  • В Visual Studio в главном меню откройте "Инструменты" > "Параметры"
  • Развернуть проект и решение Node, показанное в диалоговом окне
  • Выбор внешних веб-инструментов
  • Добавить новую запись, указывающую на C:\Program Files\nodejs (или в том месте, где вы установили nodejs)
  • Переместите его в начало списка.

введите описание изображения здесь

  1. Перезапустите Visual Studio и восстановите пакеты npm.

Это должно устранить указанные ошибки, но теперь, если вы попытаетесь скомпилировать проект, вы можете увидеть много ошибок в основном из-за отсутствующих определений типов, например:

Код степени серьезности Описание Состояние подавления строки файла проекта
Ошибка TS6053: Файл /node_modules/angular2/ts/typings/jasmine/jasmine.d.ts не найден

Недействительное имя модуля в дополнении, модуль '../../Observable' не найден. TypeScript Виртуальные проекты node_modules\rxjs\add\operator\zip.d.ts

Свойство 'map' не существует в типе 'Observable'.

Чтобы исправить выше ошибки, все, что вам нужно сделать, это просто добавить ссылку ниже поверх вашего main.ts или bootstrap.ts:

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

Это должно устранить описанные выше ошибки типирования.

С помощью RC команда Angular предлагает все компоненты в виде отдельных файлов. Итак, в прошлом, если бы вы включили пакет Angular в виде упакованного файла angular2.dev.js(или файла min) в файл индекса, это не будет работать сейчас. Необходимые компоненты должны быть включены в индекс, который требуется вашему приложению. Вы можете использовать systemjs.config.js для включения зависимостей add. Я бы настоятельно рекомендовал в официальном руководстве по быстрому началу работы в этом разделе:

Ссылка: https://angular.io/guide/quickstart

Даже после правильной настройки, следуя приведенным выше шагам, при запуске приложения вы можете увидеть 404 для отсутствия файлов Angular.

Причина в том, что по умолчанию ASP.Net 5 ищет зависимости Angular в каталоге /wwwroot/ node_modules/. И поскольку node_modules находится в корневой папке проекта, а не в папке wwwroot, браузер возвращает 404 (ошибки не найдены). Таким образом, перемещение папки @angular из папки node_modules в wwwroot должно устранить проблему.

Ошибки карты

В некоторых случаях обновление версии TypeScript также устраняет ошибки карты:

Попробуйте выполнить обновление до TypeScript 2, выполнив следующие шаги:  - В Visual Studio нажмите "Сервис" > "Расширения и обновления".  - Выберите "Интернет" в списке, показанном слева от диалогового окна  - Поиск TypeScript  - Из результатов поиска установите TypeScript 2.0 Beta для Microsoft Visual Studio 2015.  - Перезагрузите компьютер и, надеюсь, он исправит все ошибки карты.

Надеюсь, что это поможет.

Ответ 2

вам нужно добавить

/// <reference path="../node_modules/angular2-in-memory-web-api/typings/browser.d.ts" />

поверх вашего main.ts или bootstrap.ts, который удалит ошибку типирования

ссылка включена в

angular2 -в-памяти веб-API

Ответ 3

Решение этой проблемы может быть обновлено версией Node и NPM, как описано здесь (проблема существует с версиями NPM/Node - все выше Node v5.10.1 и npm v3.8.6 +, похоже, отлично).

загрузите последнюю версию Node из приведенной ниже ссылки в соответствии с архитектурой окон с 32/64 бит

https://nodejs.org/en/blog/release/v5.10.1/://