Angularの "5 MIN QUICKSTART"に基づいて非常に単純なAngular 2アプリケーションを実行しようとすると、次のエラーメッセージが常にコンソールウィンドウに表示されます。 Chromeブラウザ：「例外：AppComponent上に指示アノテーションが見つかりません」アプリケーションはAngularの "5 MIN QUICKSTART"とは異なり、node.jsは使用されていません。 Visual Studio 2015を使用してアプリケーションを作成して実行しました。 NPMは "node_modules"と "typings"ディレクトリとその内容をダウンロードするために使用されました。 「5 MIN QUICKSTART」コードは、NPMを使用してダウンロードされたものに対応するように変更されました。基本的には、 "@ angle/core"を "node_modules/@ angular/core/index"に置き換えることになりました。 "node_modules"内の1つのファイルがこのように変更されました。これらの変更はうまくいくように見えた。すべての角度モジュールとアプリケーションモジュールが正常にロードされました。しかし、それが完了すると、アプリケーションは失敗します。シンプルなスターターangle2 app yields： "例外：AppComponentに指令がありません"
非常に簡単です。 Angularからダウンロードされたものは、それが存在すると思われる場所です。アプリケーションは正常に読み込まれて実行されていますが、最後の2秒で失敗します。誰もこのアプリケーションを実行させる方法に関するいくつかのガイダンスを提供できますか？
関連するコードファイルは次のとおりです。
index.htmlを
<html>
<head>
<title>Angular 2 QuickStart</title>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<!-- 1. Load libraries -->
<!-- Polyfill(s) for older browsers -->
<script src="node_modules/core-js/client/shim.min.js"></script>
<script src="node_modules/zone.js/dist/zone.js"></script>
<script src="node_modules/reflect-metadata/Reflect.js"></script>
<script src="node_modules/systemjs/dist/system.src.js"></script>
<!-- 2. Configure SystemJS -->
<script src="systemjs.config.js"></script>
<script>
System.paths = {
"Components/App.Component": "Components/App.Component.js"
}
</script>
<script>
System.import('main.js').catch(
function (err) {
console.error(err);
}
);
</script>
</head>
<!-- 3. Display the application -->
<body>
<app-view>Loading...</app-view>
</body>
</html>
Main.ts
import {bootstrap} from 'node_modules/@angular/platform-browser-dynamic/index';
import {AppComponent} from 'Components/App.Component';
bootstrap(AppComponent).catch(err => alert(err)).then(compRef => {
});
App.Component.ts「インポートを使用
import {Component} from 'node_modules/@angular/core/index';
@Component({
selector: 'app-view',
template: '<h1>My First Angular 2 App</h1>'
})
export class AppComponent
{
}
{コmponent}から '@ angle/core' "はAngular指定の人が（" 5 MIN QUICKSTART "の中で）使用すべきものです。しかし、QUICKSTARTは、指定されたTypescriptコンパイラを使用してアプリケーションをコンパイルし、Node.jsを使用して実行することを前提としています。 "@ Anger/Core"からのimport {Component}は、SystemJS（モジュールローダー）がsystemjs.config.jsでどのように設定されているかによって機能します。 Visual Studio 2015（VS）で開発する場合は、VSに固有のTypescriptコンパイラが使用され、VSに固有のサーバーがアプリケーションの実行に使用されます。 '@ angular/core'は、名前が "core"（拡張子）のファイルを意味するため、Intellisense（コード補完）とコンパイラエラーにつながります。アプリケーションディレクトリのサブディレクトリである "@angular"というディレクトリにあります。もちろん、そのようなディレクトリやファイルはありません。実際のファイルは、Intellisenceが動作しているときは "〜/node_modules/@angular/core/index.d.ts"、コンパイラがあるときは "〜/ node_modules /@angular/core/index.js"にあります。実行している（私は思う）。だからVS "node_modules/@ angular/core/index"を使用するときは、目的のファイルの正確な場所を参照するため、使用する必要があります。しかし、そのパスを使用すると上記のエラーが発生します。
「角度/コア@」は動作しません。 – CCubed