2016-11-28 8 views
1

iは、NPM /ガルプ/ SystemJSangular2は

をしてプロジェクトAngular2 /活字体/ ASP.Netコア を開始しようとしました。しかし、そこにすべてのチュートリアルではuptodateではないかと思われます私は何かが欠けている...

私は試してみるときに、 "コンポーネント@}を@角度/コア"からインポートしてください。 Visual Studioはもはやビルドされておらず、モジュール '@ angular/core'を見つけることができないと言っています。ここで

は私のconfigsファイルです:

NPM:

{ 
    "dependencies": { 
     "@angular/common": "2.1.2", 
     "@angular/compiler": "2.1.2", 
     "@angular/core": "2.1.2", 
     "@angular/forms": "2.1.2", 
     "@angular/http": "2.1.2", 
     "@angular/platform-browser": "2.1.2", 
     "@angular/platform-browser-dynamic": "2.1.2", 
     "@angular/router": "3.1.2", 
     "@angular/upgrade": "2.1.2", 
     "core-js": "^2.4.1", 
     "moment": "^2.14.1", 
     "ng2-bootstrap": "^1.0.24", 
     "reflect-metadata": "^0.1.3", 
     "rxjs": "5.0.0-beta.6", 
     "systemjs": "^0.19.37", 
     "typings": "^2.0.0", 
     "zone.js": "^0.6.12" 
    }, 
    "devDependencies": { 
     "gulp": "3.9.1", 
     "gulp-clean": "0.3.2", 
     "gulp-concat": "2.6.1", 
     "gulp-sourcemaps": "1.9.1", 
     "gulp-typescript": "3.1.3", 
     "gulp-uglify": "2.0.0", 
     "typescript": "2.0.10" 
    }, 
    "name": "kira", 
    "private": true, 
    "scripts": { 
     "postinstall": "typings install dt~core-js --global" 
    }, 
    "version": "1.0.0" 
} 

systemjs.config.js:

(function (global) { 
    System.config({ 
     paths: { 
      'npm:': 'node_modules/' 
     }, 
     map: { 
      app: 'wwwroot/app', 
      '@angular/core': 'npm:@angular/core/bundles/core.umd.js', 
      '@angular/common': 'npm:@angular/common/bundles/common.umd.js', 
      '@angular/compiler': 'npm:@angular/compiler/bundles/compiler.umd.js', 
      '@angular/platform-browser': 'npm:@angular/platform-browser/bundles/platform-browser.umd.js', 
      '@angular/platform-browser-dynamic': 'npm:@angular/platform-browser-dynamic/bundles/platform-browser-dynamic.umd.js', 
      '@angular/http': 'npm:@angular/http/bundles/http.umd.js', 
      '@angular/router': 'npm:@angular/router/bundles/router.umd.js', 
      '@angular/forms': 'npm:@angular/forms/bundles/forms.umd.js', 
      '@angular/upgrade': 'npm:@angular/upgrade/bundles/upgrade.umd.js', 
      'rxjs': 'npm:rxjs' 
     }, 
     packages: { 
      app: { 
       main: './main.js', 
       defaultExtension: 'js' 
      }, 
      rxjs: { 
       defaultExtension: 'js' 
      } 
     } 
    }); 
})(this); 

マイapp.component.ts

import { Component } from '@angular/core'; 

@Component({ 
    selector: 'my-app', 
    template: `<h1>Hello {{name}}</h1>` 
}) 

export class AppComponent { name = 'Angular'; } 

答えて

1

Iようやくm任意の時間!私は、数分後に...

私の問題は私のtsconfig.jsonに

た解決策を見つけるために質問をするために必要な、私は「モジュール」を使用していた:働いていませんでした「システムは」(私ドン」本当に理由は分かっています...)

これを 'module': 'commonjs'に変更しました。 :D

EDIT:

は、私が "システム" は私のtsconfig.jsonのためのモジュールとして働いていなかった理由を発見しました。 私はモジュールパッケージ化にNode.jsを使用しています。ノードはcommonjsを使用してこれらのモジュールを展開していますので、typescriptがそれらを読むことができるようにcommonjsをtsconfigに入れる必要があります。