Как выглядит минимальная конфигурация сборки для 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">

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

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

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

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

1 ответ

Решение

Посмотрите эту QnA для встраивания вашего слоя в файл dojo.js. Я мог бы также поделиться своим опытом, так как мне потребовалось несколько проб и ошибок, чтобы заставить мои бутстрапы работать должным образом. На самом деле ответ легко найти в файле 'dojosdk/util/buildscripts/profile /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', расположенный за пределами корня dojo SDK, его нужно будет применить при назначении packages в dojoConfig, Ключ атрибута, хотя, вместо prefixes для профиля слоя.

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

Как создать подмодульный слой

Возможно, вы захотите создать подмодуль своего приложения, чтобы, например, для всплывающего диалогового окна потребовалось дополнительное время - его можно загрузить во время выполнения в отдельном пакете. Чтобы убедиться, что зависимости, которые уже загружены через ваш основной модуль-слой, не включены в подмодульный слой, ключ атрибута, который вы ищете, это 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" ]
  ]
}

Это должно привести к двум оптимизированным файлам слоев, один со стандартным 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>
Другие вопросы по тегам