7

新しい ASP.NET 5 アプリケーションで Aurelia のスケルトン ナビゲーション プロジェクトをセットアップしようとしています。私は多くのことを試し、近づいていると信じていますが、実際にはクライアント側のテストに巻き込まれています。

GitHub の Aurelia リポジトリからスケルトン プロジェクトをダウンロードし、解凍しました。

この投稿で説明されているように、jspm パッケージを wwwroot フォルダーに配置するように jspm 設定を設定するための Scott Allen の提案を利用しました。

次に、プロジェクト構造を次のように更新しました。

sln
|->wwwroot
 |->dist
 |->jspm_modules
 |->src
 |->styles
 |->test
 |->config.js
 |->index.html
 |->index.js
|->build
|->Controllers
|->doc
|->node_modules
|->aurelia.protractor.js
|->aureliafile.js
|->gulpfile.js
|->karma.conf.js
|->package.json
|->project.json
|->protractor.conf.js
|->Startup.cs

2 つの質問があります。

1. Aurelia スケルトン ナビゲーション スタートアップ プロジェクトのテスト フォルダーはどこに置くべきですか? 一方で wwwroot は、アプリケーション固有の JavaScript ファイルの残りの部分が存在する場所であるため、非常に理にかなっています。一方で、これらのファイルは決してクライアントに提供されるべきではないため、それらを wwwroot に置くことはあまり意味がありません。

2.それらがプロジェクト構造の適切な場所に配置されたら、テストを適切に実行するためにどのファイル/値を更新する必要がありますか? とりあえず、wwwroot ディレクトリに配置しました。karma.conf.js ファイルの basePath を「wwwroot」に更新しました。karma startコマンドを実行すると、「/base/app-bundle.js」を見つけようとして 404 エラーが発生します。そのファイルは「wwwroot/dist/app-bundle.js」に存在しますが、カルマを構成してそこに見つける方法がわかりません。

どんな助けでも大歓迎です。

4

3 に答える 3

4

これは素晴らしい質問であり、将来、Visual Studio と IIS だけでなく、アプリケーションを提供する親フレームワークによって駆動されるすべてのプロジェクト構造に役立つことを願っています。

カルマ.conf.js

まず、実際にテストしているものを見てみましょう。karma-jspm には babel を使用してオンザフライでトランスパイルする機能があるため、distsrcではなくをテストします。カルマ構成パスがすべてそこを指していることを確認したいので、これは重要ですが、config.js実際にアプリを実行するときに system.js が dist からファイルを取得することを認識できるように、そのままにしておきます。

ベースパス設定

基本パスはそのままにしておきましょう。にテストと src がありwwwrootますが、あなたが言及したように、実際にはテストが属する場所ではありません。それらをルートに戻しbasePath: ''、すべてのパスがルートから始まるように設定しましょう。

jspm設定

次に、どのファイルを読み込むか、どのパスを作成するかなど、jspm 固有の設定をセットアップする方法を karma に伝えましょう。ここで覚えておくべき重要なことの 1 つは、 as ヘルパーpathsで定義する new をconfig.jskarma.conf.js で更新する必要があるということです。これは、(config.js が指す)srcではなくをテストしているためです。また、カルマがそれらをロードする場所を認識できるように、で始まるファイルまたはファイルへのパスにdist必ず先頭に追加してください。wwwroot/src

jspm: {
  // Edit this to your needs
  loadFiles: ['wwwroot/src/**/*.js', '/test/unit/**/*.js'],
  paths: {
    '*': '*.js',
    "services/*": "wwwroot/src/services/*.js"
  }
},

バベルの設定

最後に、前処理が必要なファイルと使用するオプションをカルマが認識できるように、babel (または traceur) の設定を更新する必要があります。これはsrc、テストのために からロードしているためです。

preprocessors: {
  'test/**/*.js': ['babel'],
  'wwwroot/src/**/*.js': ['babel']
},

脚注

通常、私は役立つコードサンプルの束にリンクしますが、この場合、この回答でスパムをコード化するのが適切だと思いますが、将来的に karma-jspm に変更が発生した場合は、編集するか注意する価値があるかもしれませんコメントで、答えが古くならないようにします。

于 2015-09-14T14:09:12.837 に答える
2

この時点でテストフォルダーをどこに置くかについて決定的な答えがある場合はIDKですが、私が行ったことは、「テスト」フォルダーと「wwwroot」を兄弟として持つ新しい「アプリ」フォルダーを作成することです。このように、あなたが言及したように、テスト ファイルは wwwroot 内にないため、クライアントに提供されず、それらを論理的にグループ化するという利点が得られます。

サイト構造

次に、wwwroot を参照するパスを更新するだけです。

カルマ.conf.js

ここに画像の説明を入力

パッケージ.json :

パッケージ.json

project.json :

ここに画像の説明を入力

于 2015-09-14T14:08:58.090 に答える
1

@PWKadの答えに基づいて構築：

また、Karma がパスを取得できるように、 Karma に渡される構成オブジェクトのpathsプロパティを変更して、各パスを先頭に追加する必要がある場合もあります。jspmbase/

たとえば、私のsrc/App/wwwroot/config.jsファイルは次のようになります

paths: {
    "*": "app/*",
    "github:*": "jspm_packages/github/*",
    "npm:*": "jspm_packages/npm/*"
}

そして私のkarma.conf.js見た目はこんな感じ

basePath: '',
urlRoot: '/',
jspm: {
     config: 'src/app/wwwroot/config.js',
     packages: 'src/app/wwwroot/jspm_packages',
     loadFiles: 'tests/unit/**/*.js',
     serveFiles: 'src/app/wwwroot/app/**/*.js',
     paths: {
                "app/*": 'base/src/app/wwwroot/app/*',
                "test/*": 'base/test/*',
                "github:*": 'base/src/app/wwwroot/jspm_packages/github/*',
                "npm:*": 'base/src/app/wwwroot/jspm_packages/npm/*'
            }
}

このプロジェクトには、この状況に対応する作業ユニット テストが設定されています。Typescript を使用しますが、コンセプトは同じです。

于 2015-09-14T19:03:14.667 に答える