Проблема с Dojo Build and Conversion для AMD

Question

Я работаю над приложением Dojo, написанным кем-то другим. Я новичок в Dojo, но обнаружил, что для сокращения HTTP-запросов мне нужно создать версию «build». Это я сделал, AFAICT (я получаю как минимум один сжатый скрипт), но при использовании встроенного скрипта ни одна из функций, которые ранее не работали (они «неопределены»).

Кроме того, пытаясь понять это, похоже, было бы неплохо сделать код AMD совместимым (является ли этот код совместимым с AMD). Как это будет работать с примерами, такими как ниже? Из чтения видно, что мне может понадобиться сделать каждую существующую функцию из сценариев, подобных этому, в модуль, который создавал бы сотни скриптов и не чувствовал себя хорошо. Как лучше всего конвертировать такой код, чтобы он был совместим с AMD и был построен?

У меня 15 или так .js скрипты все содержащие различное число функций, написанных таким образом ...

ТИА!

var somethingStatus = false; 

somethingInit(); 

function somethingInit() { 

    require(["dojo/ready", "dojo/dom", "dojo/dom-construct", "dojo/cookie", "dojo/json", "dojo/domReady!"], function(ready, dom, domConstruct) { 

     ready(function() { 

      var content = ''; 
      // content generated here, then... 

      domConstruct.place(content, dom.byId('body')); 

     }); 

    }); 

} 

function somethingToTop(target) { 

    require(["dojo/dom", "dojo/dom-style", "dojo/_base/fx", "dojo/window", "dojo/domReady!"], function(dom, domStyle, fx, win) { 

     var vs = win.getBox(); 

     somethingBarStatus = true; 

     fx.animateProperty({ 
      node: dom.byId('somethingBar'), 
      properties: { 
       top: { start: domStyle.get('somethingBar', 'top'), end: 0 }, 
       height: { start: domStyle.get('somethingBar', 'height') + (domStyle.get("somethingBar", "padding") * 2), end: vs.h } 
      }, 
      duration: 500, 
      onEnd: function() { 
       document.location = 'http://192.168.0.1' + target; 
      } 
     }).play(); 

    }); 

} 

function somethingEmptyTop() { 

    require(["dojo/dom", "dojo/dom-construct", "dojo/domReady!"], function(dom, domConstruct) { 

     globalContainerEmpty('somethingTop'); // this function is in another .js file, constructed similarly to this 

    }); 

} 

// many more functions like this below and across other scripts! 

Answer 1

Вы бежите в общей проблемы при переходе от предварительного AMD Dojo в Dojo 1.7, в том, что многие люди будут пытаться запускать скрипты через сборки, которые полностью не модули. Инструмент сборки Dojo действительно предназначен для размещения модулей, а не для скриптов, но такого рода вещи случались с «Just Work» раньше.

В приведенном выше примере у вас есть скрипт, который, как представляется, просто определяет ряд глобальных функций. Во всяком случае, это инверсия правильного модуля, поскольку каждая отдельная функция включает в себя свой собственный вызов require.

Когда сборка Dojo встречает файл, который определяет уже не в формате AMD, он помещает обертку AMD вокруг него, с целью адаптации собственных модулей устаревших Dojo, которые используют dojo.provide, dojo.require и глобальные пространства имен, как dojo и dijit. Проблема в том, что когда эти «глобальные» функции в вашем скрипте завернуты, они становятся локальными для фабрики define в оболочке и, таким образом, больше не являются глобальными.

Правильное преобразование кода выше, будет выглядеть примерно так:

define([ 
    'dojo/_base/fx', 
    'dojo/cookie', 
    'dojo/dom', 
    'dojo/dom-construct', 
    'dojo/dom-style', 
    'dojo/json', 
    'dojo/window', 
    'my/otherModule', 
    'dojo/domReady!' 
], function (fx, cookie, dom, domConstruct, domStyle, JSON, win, otherModule) { 

    var somethingStatus = false; 

    var util = { 
     somethingInit: function() { 
      var content = ''; 
      // content generated here, then... 

      domConstruct.place(content, dom.byId('body')); 
     } 

     somethingToTop: function (target) { 
      var vs = win.getBox(); 

      somethingBarStatus = true; 

      fx.animateProperty({ 
       node: dom.byId('somethingBar'), 
       properties: { 
        top: { start: domStyle.get('somethingBar', 'top'), end: 0 }, 
        height: { start: domStyle.get('somethingBar', 'height') + (domStyle.get("somethingBar", "padding") * 2), end: vs.h } 
       }, 
       duration: 500, 
       onEnd: function() { 
        document.location = 'http://192.168.0.1' + target; 
       } 
      }).play(); 
     }, 

     somethingEmptyTop: function() { 
      // assuming that the other module was converted similarly to this one 
      otherModule.globalContainerEmpty('somethingTop'); 
     } 
    }; 

    util.somethingInit(); 
    return util; 
} 

• Обратите внимание, что все зависимости ранее в каждой отдельной функции были собраны в define вызова этого модуля.
• dojo/ready, как правило, не требуется с AMD с dojo/domReady! уже ждет DOMContentLoaded (или эквивалент), а завод define уже ожидает загрузки модулей.

Вы бы тогда быть в состоянии получить доступ к каждой из функций на этом модуле, загрузив его через define в другом модуле или require в сценарии страницы, то ссылки на функции с помощью переменной хранятся модуль в. (В этот пример, otherModule пример использования другого преобразованный модуля, так как вы предположили, что globalContainerEmpty в другом аналогичном файл сценарий.)

modules tutorial может надеяться предоставить дополнительную помощь, и, возможно, также modern Dojo учебника.