jQuery Mobile的require.js和骨干 [英] jquery mobile require.js and backbone

问题描述

我真的require.js和jQuery Mobile的挣扎。我有一个基于松散的基础文件结构和装载模式关闭的

I'm really struggling with require.js and jquery mobile. I have a loosely based file structure and loading pattern based off of

<一个href=\"https://github.com/appboil/appboil-requirejs-backbonejs-jquerymobile-phonegap\">https://github.com/appboil/appboil-requirejs-backbonejs-jquerymobile-phonegap

但它的老，我不得不做出adaptions为需要2.0版本。有没有使用jQuery移动，backbonejs的社会接受的方式和requirejs在一起吗？我想用骨干的路由，而不是jQuery的手机。此外，模板有PhoneGap的，这我不关心。

but it's old and I had to make adaptions for the require 2.0 version. Is there a community accepted way of using jquery mobile, backbonejs and requirejs together? I'd like to use backbone's routing and not jquery mobiles. Additionally, that template has phonegap, which i'm not concerned with.

推荐答案

下面是我用的main.js文件...

Here is the main.js file I use...

require.config({
  baseUrl: "/js/",
  paths: {
    jquery: 'libs/jquery/jquery-1.7.1',
    'jquery.mobile-config': 'libs/jqm/jquery.mobile-config',
    'jquery.mobile': 'libs/jqm/jquery.mobile-1.1.0',
    'jquery.mobile.asyncfilter': 'libs/jqm/asyncfilter',
    underscore: 'libs/underscore/underscore-1.3.3',
    backbone: 'libs/backbone/backbone-0.9.2',
    templates: '../templates'
  },
  shim: {
          'underscore': {
            exports: "_"
          },
          'backbone': {
              //These script dependencies should be loaded before loading
              //backbone.js
              deps: ['jquery','underscore'],
              //Once loaded, use the global 'Backbone' as the
              //module value.
              exports: 'Backbone'
          },
          'jquery.mobile-config': ['jquery'],
          'jquery.mobile': ['jquery','jquery.mobile-config'],
          'jquery.mobile.asyncfilter': ['jquery.mobile'],
        }
});

require([
  'jquery',
  'app',
  'jquery.mobile','jquery.mobile.asyncfilter'
], function( $, App ){
    $(function(){
      App.initialize();
    });
});

的最后一位是非常重要的是得到JQM正确加载（实际上运行）。本部分：

The last bit is very important to get JQM to load correctly (and actually function). This part:

require([
      'jquery',
      'app',
      'jquery.mobile','jquery.mobile.asyncfilter'
    ], function( $, App ){
        $(function(){
          App.initialize();
        });
    });

因为我需要JQM（jQuery Mobile的）jQuery的，我将所有这些，感谢加载到垫片code以上，依赖加载正确的顺序。我真的不传递任何JQM可变进函数调用，只把$和App。下一个重要的部分是JQM-config文件：

Since i need jquery for jqm (jquery mobile), i'll load them all and thanks to the shim code above, the dependencies are loaded in the correct order. I don't actually pass any jqm variable into the function call, which only passes $ and App. The next important part is the jqm-config file:

define(['jquery'], function ($) {
      $(document).on("mobileinit", function () {
          $.mobile.ajaxEnabled = false;
          $.mobile.linkBindingEnabled = false;
          $.mobile.hashListeningEnabled = false;
          $.mobile.pushStateEnabled = false;
      });
});

您可以将所有的preINIT code为在该文件中JQM。毕竟，你应该能够使用JQM！

You can place all of your preinit code for jqm in that file. After all that, you should be able to use jqm!

这篇关于jQuery Mobile的require.js和骨干的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！