Dojo сборка CSS и пользовательский JavaScript

Я создал одну html-страницу, которая использует три виджета Dojo, и я пытаюсь создать из нее пользовательскую сборку, используя Dojo 1.7.5. Сборка удалась, и у меня остался dojo.js, включающий файлы, которые мне нужны, используя этот файл сборки:

var dependencies = {
action: "release",
selectorEngine: "acme",
stripConsole: "none",
cssOptimize: "comments.keepLines",

layers: [
    {
        name: "dojo.js",
        dependencies: [
            "dijit.form.ValidationTextBox",
            "dijit.form.DropDownButton",
            "dijit.form.Button",
            "dijit.form.Form",
            "dijit._base",
            "dijit._Container",
            "dijit._HasDropDown",
            "dijit.form.ComboButton",
            "dijit.form.ToggleButton",
            "dijit.form._ToggleButtonMixin",
            "dojo.parser",
            "dojo.date.stamp",
            "dojo._firebug.firebug"
        ]
    }, {
        name: "../test/test.js",
        dependencies: [
            "test.test"
        ]
    }
],

prefixes: [
    [ "dijit", "../dijit" ],
    [ "dojox", "../dojox" ],
    [ "ourpeople", "../ourpeople" ]
]
};

Вопросы, на которые я не могу найти ответ:

  • Я использую cssOptimize, я ожидал один файл CSS, в который были импортированы все используемые файлы CSS. Однако я не могу найти такой файл. Это то, как додзё сжимает это CSS или мои ожидания неверны? Если так, где я могу найти это в своей папке выпуска?
  • Мой test.js содержит функцию test1(), если я вызываю ее из моего встроенного js, он утверждает, что test1 не определен. Я вызываю эту функцию напрямую, без додзё. Я предполагаю, что создание пользовательских js работает, только если это класс dojo, использующий объявить?
  • Последний вопрос, мне нужно было включить несколько файлов dojo в сборку вручную, например dojo._firebug.firebug, так как после моей первоначальной сборки все еще использовались вызовы xhr для получения этих файлов. После включения файлов вручную я все еще вижу вызовы xhr из dojo в конкретные ресурсы: dojo/nls/dojo_ROOT и dijit/form/nls/validate.js. Эти файлы создаются в процессе сборки и поэтому не могут быть включены в зависимости в профиле сборки. У кого-нибудь есть какие-либо мысли по этому поводу, так как я хочу распространять додзё в одном файле.

Я довольно плохо знаком с системой сборки dojo и (особенно), поэтому, возможно, я ожидаю того, для чего система сборки dojo не предназначена, или, может быть, я поступаю неправильно, если какие-либо советы или предложения более Добро пожаловать.

Ура!

Test.js:

function test1() {
    console.log("test1");
}

Index.php:

<script type="text/javascript" src="js/release/dojo/dojo/dojo.js"></script>
<script type="text/javascript" src="js/release/dojo/test/test.js"></script>

<script type="text/javascript">                     
    dojo.require("dijit.form.ValidationTextBox");
    dojo.require("dijit.form.Button");
    dojo.require("dijit.form.Form");            

    dojo.ready(function() {
        test1();
    });
</script>

1 ответ

Решение

Я использую cssOptimize, я ожидал один файл CSS, в который были импортированы все используемые файлы CSS. Однако я не могу найти такой файл. Это то, как додзё сжимает это CSS или мои ожидания неверны? Если так, где я могу найти это в своей папке выпуска?

Когда вы используете cssOptimize, сборка Dojo оптимизирует и выравнивает CSS-файлы. Так, например, если вы используете тему Clar Dijit, когда вы загружаете dijit/themes/claro/claro.css из источника, он содержит серию @import заявления, которые в свою очередь загружают больше файлов. Когда вы загружаете claro.css из сборки с cssOptimize, это один файл, содержащий все стили, на которые ранее ссылались эти отдельные файлы.

Мой test.js содержит функцию test1(), если я вызываю ее из моего встроенного js, он утверждает, что test1 не определен. Я вызываю эту функцию напрямую, без додзё. Я предполагаю, что создание пользовательских js работает, только если это класс dojo, использующий объявить?

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

Учитывая, что вы используете Dojo 1.7, в идеале вы должны использовать формат AMD для определения и использования модулей. В dojotoolkit.org есть учебное пособие, посвященное модулям AMD, и, если вы переходите с Dojo 1.6 или более ранней версии, есть также учебное пособие, которое поможет вам перейти.

Последний вопрос, мне нужно было включить несколько файлов dojo в сборку вручную, например dojo._firebug.firebug, так как после моей первоначальной сборки все еще использовались вызовы xhr для получения этих файлов. После включения файлов вручную я все еще вижу вызовы xhr из dojo в конкретные ресурсы: dojo/nls/dojo_ROOT и dijit/form/nls/validate.js. Эти файлы создаются в процессе сборки и поэтому не могут быть включены в зависимости в профиле сборки. У кого-нибудь есть какие-либо мысли по этому поводу, так как я хочу распространять додзё в одном файле.

Я не уверен, почему вы видите dojo/_firebug/firebug будучи автоматически загруженным, но исходя из того, что вы сказали / показали выше, я бы сразу предложил следующее:

  • Конвертируйте ваши модули / код в формат AMD
  • добавлять async: true на ваш dojoConfig что заставит загрузчик работать в асинхронном режиме, что означает:
    • Загружает модули через внедрение скрипта вместо синхронного XHR
    • Это не будет безусловно загружать все dojo/_base
  • добавлять customBase: true на ваш dojo/dojo слой, который будет препятствовать сборке по умолчанию, чтобы включить все dojo/_base

Для nls модули, в той степени, в которой это нормально, чтобы по-прежнему видеть запрошенные NLS-файлы, хотя, если ваша сборка настроена правильно, обычно просто будет один NLS-файл на слой, и все (факт, что вы видите отдельный запрос на validate заставляет меня думать, что вы не охватили все ваши зависимости). Причина, по которой NLS остается отдельной, заключается в том, что для каждой локали существует один пакет NLS, и нет смысла объединять все локали в один уровень - это заставит людей платить за ресурсы на 20 языках, которые им не нужны.

Другие вопросы по тегам