Это именно то, что пакет, как RequireJS для. Использование загрузчика модуля, такого как RequireJS, позволяет асинхронно загружать несколько JS-файлов и определять обратные вызовы для загрузки файлов.
Вот простой пример ...
Вместо того чтобы загружать ваши JQuery, и/или другие файлы JS, только <script>
загрузить это скрипт RequireJS.
<script data-main="js/app" src="js/require.js"></script>
Атрибут data-main
говорит RequireJS, чтобы загрузить файл на /js/app.js
, который содержит параметры конфигурации RequireJS. Вот пример /js/app.js
:
requirejs.config({
"baseUrl": "js/lib",
"paths": {
"app": "../app",
"jquery": "//ajax.googleapis.com/ajax/libs/jquery/2.0.0/jquery.min",
"jqueryMobile": "//ajax.googleapis.com/ajax/libs/jquerymobile/1.4.5/jquery.mobile.min"
}
});
// Load the main app module to start the app
requirejs(["app/main"]);
В этом случае /js/app.js
используется в основном для настройки путей. Свойство app
сообщает RequireJS, где искать ваше конкретное приложение JS, а свойство jquery
сообщает RequireJS путь к URL-адресу Google CDN для jQuery. Наконец, используйте метод requirejs()
для загрузки ваших приложений .js
. Обратите внимание, что все пути не учитываются .js
.
В этот момент RequireJS будет искать ваш app
JS по телефону app/main.js
. Создайте файл в /js/app/
с именем main.js
- так что теперь у вас есть файл /js/app/main.js
.
Этот файл будет загружать файлы jQuery и jQuery Mobile из CDN Google, асинхронно, и содержать остальную часть вашей логики приложения. Вот пример /js/app/main.js
:
define(["jquery", "jqueryMobile"], function($) {
//jQuery and jQuery Mobile have been loaded.
$(function() {
// Do stuff with jQuery and jQuery Mobile
});
});
Какой эффект это имеет? Давайте посмотрим на сетевой водопад, чтобы увидеть, как файлы загружаются:
Диаграмма выше показывает, как JQuery и JQuery Mobile загрузки асинхронно.
Для аналогичного примера см. RequireJS jQuery example.
Вы пытаетесь что-то вроде [что] (https://gist.github.com/1231586)? – neoascetic
Нет, я этого не делал. Однако последние версии jQM действительно поддерживают Require.Js. –