2

私はjqueryプラグインを書いています。プラグインには多くのコードが含まれているため、コードをいくつかのファイルに分割し、require.js を使用することにしました。私は2つのことを達成しようとしています:

  1. 分離されたバージョンのプラグインで require.js を使用してテスト ページを実行する機能。これにより、コードをデバッグできます。
  2. require.js オプティマイザー (r.js と呼ばれる) を使用し、それらのいくつかのプラグインのファイルから最適化された (結合および縮小された) 1 つのファイルを作成する機能。

私の index.html には以下が含まれます:

<script data-main="js/site" src="js/vendor/require.js"></script>

私のjs/site.jsには以下が含まれています：

require([
    'jquery',
    ....
    ....
    'main' //<---- main plugin file
], function($) {

    $(function() {
        $('#elem').photosGrid();
    });
});

そして私の main.js ファイルには以下が含まれています：

define([
    'photos-grid' //<---- Class that initialized and build the plugin
], function(PhotosGrid) {
    jQuery.fn.photosGrid = function(options) {
        var photosGrid = new PhotosGrid(this, options);
        this.data('photosGrid', photosGrid);
        return this;
    };

    return jQuery;
});

r.js を構成するために、build.js ファイルを追加しました。

({
    baseUrl: '.',
    name: "main",
    out: "main-built.js"
})

index.html を実行すると、プラグインがうまく機能します。しかし、実行するnode r.jsと次のエラーが発生します。

Error: Mismatched anonymous define() module

名前を付けて main.js を定義すると、次のようになります。

define('module-name', ['photos-grid'], function(PhotosGrid) { .....

node r.jsエラーは返されませんが、出力は出ません。さらに、index.html は main.js ('photos-grid') の依存関係を読み込まないため、Web サイトが機能しません。

私は何を間違っていますか？r.js を適切に使用するにはどうすればよいですか?

4

1 に答える 1

3

オプティマイザ モードで-o実行するフラグを渡すのを忘れていました! r.js詳しくは公式ドキュメントで

(...これは で最も一般的な問題の 1 つと思われますr.js)

于 2013-03-30T19:17:22.107 に答える