問題タブ [systemjs]

午後は、テストを開発している MEAN スタック アプリがあります。Angular コードは ES6 を使用して記述されているため、テストを実行するトランスパイラーとして Babel を使用して Karma と SystemJS を構成しようとしています。現在、karma start karma.conf.jsブラウザーが起動するとハングアップし (デバッグなどをクリックできないため)、ブラウザーが閉じてコンソール エラーが表示されます。

この前の最後の行はDEBUG [web-server]: serving (cached): ( ... )

私の現在のアプリケーション構造は次のように機能します。

すべてのモジュールを 1 つのファイルapp.jsにインポートして、アプリ モジュールに挿入します。

index.html次のように、ファイルで手動の Angular ブートストラップを使用します。

Karma と SystemJS を次のように構成しました。

ここに、テストしようとしているフィルターがあります。

そして私のテストファイル：

それでも、テストを実行しようとすると、上記のエラーが発生します。本当に気になるのは、ウィンドウに「ブラウザ実行中」と表示される前にブラウザがフリーズすることです。コードの単体テストを書きたいと思っています。

はい、読みましたグローバルjQueryとlodashに依存する非CommonJS、非AMDパッケージをシムするにはどうすればよいですか? .

jspm を介して X.js を読み込もうとしていますが、これは「パッケージ」ではなく、制御できない古い js ファイルであり、グローバルな jQuery オブジェクトが必要であり、スクリプト タグのように実行する必要があります。

System.import('app/X'); を使用しています。ロードします。

さまざまなシム/グローバルのトリックを試してロードしましたが、よくわかりません。

そのXファイルをインポートしてグローバルなjQueryオブジェクトを認識できるようにするには、config.jsをどのように記述すればよいでしょうか? X を「パッケージ」にしてインストールしなければ、より適切に shim できませんか?

ありがとう。

このコードは、div含まれている Hello World を表示するはずですが、代わりにエラーが表示されますUncaught TypeError: System.import is not a function。ng-book2 の入門チュートリアル ビデオに従っています。このビデオには、次のコードが含まれていますindex.html。

とapp.ts:

そして最後に現在のディレクトリ構造:

解決策を探してみると、十分に似ていると思われる唯一の問題は、システムに問題があると述べていconfig.jsます。このチュートリアルを除いて、ビデオは構成のヒントなしでこれが機能することを示しています。これは、ビデオで使用されているローカル HTTP サーバーではなく、リモート サーバーでホストされていることに注意してください。

開発者ウィンドウのスクリーンショット:

上記のディレクトリ構造に示されている各ファイルは、これを書いている時点で GitHub で入手できる最新のものです。リモートサーバーを使用している場合、または他の何かが完全に不足している場合に含める必要があるデフォルトの構成ファイルはありますか?

実行jspm install angularすると、jspm_packages フォルダーにローカルにインストールされました。

コードから、私は のような通常の ES6 インポートを使用しますimport angular from 'angular'。

CDN から angular をロードし、CDN が利用できない場合にローカル バージョンにフォールバックするには、どうすればよいですか?

Choose ES6 Modules Todayガイドに従っていますが、彼が使用している import ステートメントの 1 つに最後に感嘆符が付いていることに気付きました。

import 'bootstrap/css/bootstrap.css!';

その感嘆符は何を意味しますか?

この import ステートメントは、startup.jsファイルの最初の行にあります。

私は System.js と JSPM についてさらに詳しく調べており、TypeScript ソース コードを JavaScript バンドルにバンドルしたいところまで来ました。

これで、生成された JavaScript コードを次のようにバンドルできます。 jspm bundle some/source/path someDestFile.js

しかし、最初にすべての TypeScript を事前に JavaScript にビルドしてからバンドルする必要があり、コンパイル済み (および分離済み) のすべての JS ファイルが残っていることに気付きます。これは理想とはかけ離れています。

ここでjspm ドキュメントを調べましたが、解決策が見つかりませんでした。

明確にするために、ブラウザで TypeScript をコンパイルするのではなく、しっかりした JavaScript のプリコンパイル済みバンドルをコンパイルしたくありません。

どうすればいいですか？

PS私はここに見られるようにTypeScriptトランスパイラーのインストールを使用しました

以下は、angularjs 2 es6 テンプレートhttp://goo.gl/IGaTZwから開始されたプランカーからの ものです。暗黙モードが干渉している場合に備えて、traceur を追加し、main.es6.js を main.js に置き換えて削除しました。

Main.js-----

}

スクリプトファイルをダウンロードしてローカルで実行しようとしましたが、そこでも失敗しました。ラップトップに問題があるため、npmなどを使用できません。

よろしくお願いします。