0

AMD 以外のプロジェクトに含まれる AMD Javascript ライブラリを作成しようとしています。これが私のセットアップです：

app.coffee

define ->

class App

    constructor: -> console.log 'instantiating App'

    init: -> console.log 'Init called'

index.html

<body>

<script type="text/javascript" src="//code.jquery.com/jquery-1.10.2.min.js"></script>
<script type="text/javascript" src="dev-latest.js"></script>
<script type="text/javascript">
    $(document).ready(function(){
        console.log('doc', window.app);
    });

    $(function(){
        console.log('func', window.app);
    });

    window.onload = function()
    {
        console.log('onload', window.app);
    }

</script></body>

main.js

require(['cs!app'], function(app){
  return window.app = new app;
});

出力として dev-latest.js を取得するために、r.js オプティマイザーを使用してこのプロジェクトをビルドしています。これが私のビルドファイルです（PS：ビルドは成功しました）：

({
    baseUrl: './vendor',

    paths: {

        app: '../app',
        'require-lib': 'require'
    },

    name: '../main',

    out: 'dev-latest.js',

    include: 'require-lib',

    preserveLicenseComments: false

})

ブラウザでコードを実行すると、出力は次のようになります。

doc undefined
func undefined
onload undefined
instantiating App dev-latest.js:1
app.init(); // running this manually in the browser console
Init called

これについてどうすれば、使用する前にアプリをロードできますか?

4

2 に答える 2

0

AMD を使用すると、モジュールの外部で作成されたモジュールに依存することはできません。信頼できる唯一の方法は、モジュールの結果を別のモジュールにロードすることです。したがって、あなたの場合、新しいモジュールを作成する必要があり、次の場所に移動できます$.read。

define( [App], (App)-> 
  $(document).ready(function(){
        console.log('doc', App);
   });
)
于 2013-07-16T19:32:56.897 に答える
-1

CommonJS形式の依存関係の読み込みを使用し、すべての混乱を保存するbrowserify （ちょうどそれについて見つけた）を使用して解決しました。また、プロジェクトを開始するための優れたテンプレートは、amitayd の grunt-browserify-jasmine setup です。

于 2013-07-16T23:24:06.070 に答える