11

ビルドチュートリアルを調べ、Webビルド(1.7.2のみ)を見つけ、いくつかの例をテストしましたが、ビルドシステムの簡単な説明は見つかりませんでした。

私のアプリが単一のWebページであるとしましょう。

<script src="./js/App/other_non_amd_stuff_working_independently.js">
<script src="./js/lib/dojo/dojo.js" data-dojo-config="async: true"></script>
<script src="./js/App/Main.js">

DojoSDKは./lib/にあり、Main.jsにはDojo config +appbootが含まれています。

require({
    packages:[{
        name:"App",
        location:"../../App"
    }]
},  
[ "dojo/query",
  "dijit/layout/BorderContainer", 
  "App/Foo",
  "dojo/domReady!"], function(query, BorderContainer, Foo) { ... });

私の質問はこれと同じくらい簡単です:すべてのDojo / AMDのものから1つのスクリプトファイルを作成するにはどうすればよいですか?交換したいだけです

<script src="./js/lib/dojo/dojo.js" data-dojo-config="async: true"></script>
<script src="./js/App/Main.js">

シングルで

<script src="./js/Main.minified.js">

ビルドシステムをこれで動作させることは、やや自明ではないようです。./App/内のすべてのファイルをAMDモジュールに変換しようとするか(まだ私が望んでいるものではありません)、App/Mainが見つかりません。ビルドプロファイル(app.profile.js)を作成しようとしましたが、(IMOが不要な)複雑さを追加していることを除いて、これのポイントはわかりません。ビルドシステムをApp/Main.jsを含めて連結する方法を教えてください。依存関係?

ビルドシステムを理解するためのより良いチュートリアルのためのヒントもありがたいです。

4

1 に答える 1

4

レイヤーをdojo.jsファイルにビルドする方法については、このQnAを参照してください。ブートストラップを正しく機能させるには試行錯誤が必要だったので、経験を共有したほうがよいでしょう。実際、答えは「dojosdk / util / buildscripts / profiles/baseplus.profile.js」ファイル内で簡単に見つかります。

Dojo Custom Build 1.6を単一のファイルに(新しいビルドシステムと同じセットアップですが、2.0ではまだいくつかの変更が加えられる可能性があります)

dojo.jsと一緒に縫合されたメインアプリケーション層を作成する方法

dependencies ={
  layers:  [
      {
      name: "dojo.js", // overwrites regular dojo.js and ++'s your layer
      dependencies: [
         "app.main"
      ]
  }
}

場所に適切なプレフィックスを付けることを忘れないでください

'App'モジュールがdojoSDKルートの外部に配置されているため、で割り当てるのと同じものを適用する必要がありpackagesますdojoConfig。ただし、属性キーはprefixesレイヤープロファイル用です。

prefixes: [
    [ "dijit", "../dijit" ],
    [ "dojox", "../dojox" ],
    [ "App", "../../App" ]
]

サブモジュールレイヤーの作成方法

アプリのサブモジュールを作成して、たとえばポップアップダイアログに追加の追加が必要な場合に、実行時に別のパッケージでダウンロードできるようにすることができます。main-module-layerを介してすでにロードされている依存関係がsub-module-layerに含まれていないことを確認するために、探している属性キーはですlayerDependencies

組み合わせた結果は次のようになります。

dependencies ={
  layers:  [
      {
        name: "../dojo/dojo.js", // overwrites regular dojo.js and ++'s your layer
        dependencies: [
         "app.Main"
        ]
      }, {
        name: "../../App/JITModule.js",
        layerDependencies: [
         "../../App/Main"   // tells this layer that the dependencychain in Main is allready loaded (programmer must make sure this is true ofc)
        ]
        dependencies: [
         "App.JustInTimeDialog"
        ]
      }
  ]
  prefixes: [
    [ "dijit", "../dijit" ],
    [ "dojox", "../dojox" ],
    [ "App", "../../App" ]
  ]
}

これにより、2つの最適化されたレイヤーファイルが作成されます。1つは標準のone-line-dojo.js、アプリのファイルを含むdojo.cacheエントリです。使用例は次のとおりです。キャッシュされたモジュールを呼び出す必要があることに注意してください。そうしないと、requireモジュールは単にキャッシュに残ります。

HTMLでまとめる

dojoConfigを./js/App/Main.jsファイルに入れると、期待どおりに機能しません。dojo.jsの通常のコンテンツはレイヤーの上にロードされます。

<head>
  <script>
     function JITDialog() {
          require([ "App.JITDialog" ], function(dialoglayer)  {
             var dialog = new App.JustInTimeDialog();
             dialog.show();
          });
     }

     var dojoConfig = {
         async: true,
         packages:[{
            name:"App",
            location:"../../App"
         }]
     }
  </script>

  <script src="./js/lib/dojo/dojo.js"></script>

  <script>    
     require("App.Main", function() {
        // loads the layer, depending on the structure of App.Main class,
        // you can call your initializations here
        var app = new App.Main();
        app.run();
     });
  </script>

</head>
<body>
  <button onclick="JITDialog();">
      Download sub-module-layer and show a dialog on user interaction
  </button>
</body>
于 2012-08-16T20:19:41.700 に答える