AngularJSアプリケーションのモジュールを含むファイルをカルマのRequireJS設定ファイルに組み込みます。

Question

わかっていますが、設定ファイルでRequireJSを使用する場合、 'paths'と 'shim'を定義する必要があります。テスト（Karma、Jasmine）を書くとき、RequireJSの追加の構成ファイルを作成し、同じデータを再定義する必要があります。

共通の部分を抽出して動的にロードしようとします。 Angular JSアプリケーションでは問題なく動作しますが、テストでは常にエラー '404'があります。しかし、始めにしましょう。シンプルな構造例：

. 
|-- newApp 
| |-- app 
| | `-- app.require.js 
| |-- newApp.require.js 
| `-- index.html 
`-- test 
    |-- test.karma.js 
    `-- test.require.js 

index.htmlを負荷RequireJS設定ファイル

<script data-main="newApp.require.js" src="bower_components/requirejs/require.js"></script> 

newApp.require.jsのinit RequireJS

require([ 
    'app/app.require' 
], function (appRequire) { 
    "use strict"; 

    require.config({ 
     baseUrl: 'app', 
     paths: appRequire.paths, 
     shim: appRequire.shim, 
     deps: [ 
      'NewAppBootstrap' 
     ] 
    }); 
}); 

app.require.jsパスとシムを持つモジュール/オブジェクト

define([ 
    'some/others/components.require' 
], function (componentsRequire) { 
    "use strict"; 

    var appRequire = { 
     'NewApp': 'app.module', 
     'NewAppBootstrap': 'app.bootstrap', 
     'NewAppRoute': 'app.routes' 
    }; 

    var vendorRequire = { 
     'jQuery': { 
      exports: '$' 
     }, 
     'angular': { 
      exports: 'angular' 
     } 
    }; 

    return { 
     paths: Object.assign(
      appRequire, 
      componentsRequire 
     ), 
     shim: vendorRequire 
    }; 
}); 

これまですべて正常に動作しています。今私はapp.require.jsをtest.require.jsにロードしたいと思います。そして、問題が始まる...

test.require.js

var TEST_REGEXP = /(spec|test)\.js$/i; 
var allTestFiles = []; 

Object.keys(window.__karma__.files).forEach(function (file) { 
    'use strict'; 

    if (TEST_REGEXP.test(file)) { 
     var normalizedTestModule = file.replace(/^\/base\/|\.js$/g, ''); 
     allTestFiles.push(normalizedTestModule); 
    } 
}); 

require([ 
    'app/app.require' 
], function (appRequire) { 
    "use strict"; 

    require.config({ 
     baseUrl: '/base/newApp', 
     waitSeconds: 200, 
     paths: appRequire.paths, 
     shim: appRequire.shim, 
     deps: allTestFiles, 
     callback: window.__karma__.start 
    }); 
}); 

は、残念ながら、私はまだエラーがあります：

WARN [web-server]: 404: /app/app.require.js 
PhantomJS 2.1.1 (Linux 0.0.0) ERROR: 'There is no timestamp for app/app.require.js!' 

PhantomJS 2.1.1 (Linux 0.0.0) ERROR 
    Error: Script error for "app/app.require" 
    http://requirejs.org/docs/errors.html#scripterror at node_modules/requirejs/require.js:143 

を私は別のパスを試していないが、それでも何も。誰もこのファイルを読み込む方法を知っていますか？この場所にすべてのロードファイルがあるかどうか。私はどんなヒントにも感謝しています。

Answer 1

あなたのコードは、このrequireコールヒット時まで：あり効果にRequireJSの設定がなく、デフォルトのRequireJSでRequireJSをロードするHTMLページを含むディレクトリをとるようdata-mainは、使用されていない

require([ 
    'app/app.require' 
], 

をbaseUrl（the documentationを参照）。index.htmlがルートにあるので、RequireJSはモジュール名を/app/app.require.jsに解決し、それを見つけません。

あなたは完全なパスを使用して、それを回避することができます。

require([ 
    'base/newApp/app/app.require' 
], 

それともので、他のコードは、後にapp/app.requireと同じモジュールにアクセスしようとしていることを起これば、あなたは最小構成を持っている必要がありますあなたの最初の呼び出しの前にrequire：

require.config({ 
    baseUrl: '/base/newApp', 
}); 

require.configを複数回呼び出すことは完全に罰金です。その後の呼び出しでは、アトミックな値（baseUrlなど）とマージ可能な値がオーバーライドされます。 （後者の例はpathsです。最初の呼び出しは、モジュールfooためpathsを設定し、第二の呼び出しはモジュールbarためpathsを設定した場合、その結果の構成はfooとbarの両方のためのpathsを持つことになります）