web-dev-qa-db-ja.com

requirejsパスを理解する

Requirejsを使用すると、main.jsは次のようになります

requirejs.config({
    baseUrl: '/javascript/',
    paths: {
        jquery: 'http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min',
        async: 'requirePlugins/async',
            hbs: 'hbs'
    },
    waitSeconds: 7
});
define(['common'], function () {
    loadFonts();
});

Main.jsは、スクリプト呼び出しでページに含まれています

<script data-main="/javascript/main.js" src="/javascript/require-2.0.1.js"></script>

Commonは、ウェブサイトの基本関数、jquery docready関数などをdefine呼び出しでラップしたものです。

define(['jquery'], function() {
    //jQuery dependant common code
});

これは正常に機能し、jQueryはGoogle CDNから読み込まれ、コードが実行されます。しかし、main.jsのロード後にrequire呼び出しを追加すると

<script data-main="/javascript/main.js" src="/javascript/require-2.0.1.js"></script>
require(['jquery'], function ($) {
    //code
});

jqueryは、Google CDNへの定義済みパスではなく、/ javascript /jquery.jsから要求されます。私はまだrequirejsの新人ですが、他のリクエストが実行される前にパスを定義する必要があるように思われます。誰かが私が間違っていることを理解するのを手伝ってくれませんか？

javascriptjqueryrequirejs
14
Hans Skov

これは、RequireJSスクリプトタグでdata-main属性を使用していることが原因である可能性があると思います。それを解析するには、RequireJS自体をロードして解析する必要があります。私のテスト（特にIE9の場合）では、ブラウザーは、RequireJS構成ファイル（data-main属性で指定されたもの）を解析する前に、RequireJSスクリプトタグの直後にあるスクリプトタグをダウンロードして実行します。

これを回避するには、data-main属性の使用をやめ、代わりにConfigファイルを通常のスクリプトタグとしてRequireJSスクリプトタグの直後に配置しました。これですべてが満足のいくようになりました。

具体的には、次のようになります（サンプルを使用）。

<script src="/javascript/require-2.0.1.js"></script>
<script src="/javascript/main.js"></script>
6
ken

たぶん、jsをロードする必要がある前にconfigステートメントを置いてください。

最初にrequire.jsをロードし、後に構成コードを配置してから、require（['jquery']、...）;を呼び出す必要があります。

/ javascript /を検索する理由は、require.jsファイルがそこにあり、デフォルトのベースURLであるためです。

設定がrequire.jsによって使用されることはありません。

Require configについては このチュートリアル を参照してください。

5
Chris Li

特定のモジュールの場所を構成するには、mapの代わりに paths を使用することをお勧めします。

pathsは、完全なモジュールパスではなく、インクルードを簡素化/構成するためのショートカット/プレフィックスを対象としています。

覚えておいてください：グローバルに適用したいマッピングをアスタリスク（*）mapオブジェクトのキー。

0
Ben Mosher

必要に応じてdefineの名前を変更する必要があります

require(['common'], function () {
    loadFonts();
});
0
Sergey

その理由は、require.jsモジュールをロードした直後にrequire(['jquery']...を配置するためです。その結果、構成設定を読み取る前に['jquery']を読み込もうとします。

そして、なぜそれが/javascript/jquery.jsでjqueryを見つけようとするのですか？これは、data-main属性が原因です。

RequireJSは、baseUrlに関連するすべてのコードをロードします。 baseUrlは通常、ページにロードする最上位スクリプトのdata-main属性で使用されるスクリプトと同じディレクトリに設定されます。

このリンクは、require.jsモジュールのロード手順を明確にしています： http://requirejs.org/docs/api.html#jsfiles

0
Arashsoft