Как выглядит минимальная конфигурация сборки для dojo?

Я изучил сборник учебников, нашел веб-сборку (Только 1.7.2) и проверил несколько примеров - однако я не смог найти легкое объяснение системы сборки.

Скажем, мое приложение представляет собой одну веб-страницу:

<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">

SDK Dojo находится в. /lib/, Main.js содержит Dojo config + app boot:

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

Теперь мой вопрос так же прост: как я могу создать один единственный файл script из всех моих файлов Dojo/AMD? Я просто хочу заменить

<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), но я не понимаю этого, кроме того, что он добавляет (ненужную ИМО) сложность. Как я могу заставить систему сборки просто конкатенировать приложение App/Main.js вкл. зависимостей?

Также приветствуются любые подсказки для лучших обучающих программ по пониманию системы сборки.

Ответ 1

Смотрите этот QnA для создания вашего слоя в файле dojo.js. Я мог бы также поделиться своими впечатлениями, поскольку мне потребовалось несколько проб и ошибок, чтобы мои загрузочные файлы работали правильно. Фактически, ответ легко найти в файле 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 ++ your layer
      dependencies: [
         "app.main"
      ]
  }
}

Помните правильные расположения префиксов

Поскольку у вас есть модуль "App", размещенный вне корня SDK dojo, то это же нужно будет применять, когда вы назначаете packages в dojoConfig. Однако ключ атрибута вместо prefixes предназначен для профиля слоя.

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

Как создать слой дополнительного модуля

Возможно, вы захотите создать подмодуль своего приложения, так что если для всплывающего диалогового окна, например, требуется дополнительная возможность, их можно загрузить во время выполнения в отдельном пакете. Чтобы убедиться, что зависимости, которые уже загружены через ваш основной модуль-слой, не включены в подмодульный слой, вы должны найти ключ атрибута, который вы ищете layerDependencies.

Это было бы похоже на комбинированный результат:

dependencies ={
  layers:  [
      {
        name: "../dojo/dojo.js", // overwrites regular dojo.js and ++ 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" ]
  ]
}

Это должно привести к созданию двух оптимизированных файлов слоев, один из которых содержит стандартную однострочную запись dojo.js плюс a 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>