2014-01-13 4 views
1

Я относительно новичок в requirejs. Я пытаюсь загрузить мои зависимости IE через require, но только если браузер ниже IE9. Я пытаюсь использовать подход, предложенный в https://stackoverflow.com/a/11846837/1954860 для загрузки зависимостей IE.Загрузка зависимостей IE с requireJS

Проблема в том, что когда этот код загружен, jQuery/$ еще не определен. Это код моего main.js:

require.config(
{ 
    baseUrl: 'scripts', 
    paths: { 
     // Vendor modules 
     angular: 'vendor/angular/angular', 
     jquery: 'vendor/jquery', 
     domReady: 'vendor/domReady', 
     angularResource: 'vendor/angular/angular-resource', 
     angularTouch: 'vendor/angular/angular-touch', 
     openLayers: 'vendor/openlayers', 
     typeAhead: 'vendor/typeahead', 
     azimuth: 'vendor/azimuth/module' 

     // App modules 

    }, 
    map: { 
     // This mapping makes sure noConflict is used for jquery. Use noConflict.js to configure whether or not 
     // window.jQuery should remain available. If it is not left available in the global namespace, any jquery 
     // plugins that do not use AMD cannot be used without modifying those plugins to be AMD modules. 
     // So be warned. 
     '*': { 
      'jquery': 'noConflict' 
     }, 
     noConflict: { 
      jquery: 'jquery' 
     } 
    }, 
    shim: { 
     angular: { 
      deps: ['jquery'], 
      exports: 'angular' 
     }, 
     angularResource: { 
      deps: ['angular'] 
     }, 
     angularTouch: { 
      deps: ['angular'] 
     }, 
     openLayers: { 
      exports: 'openLayers' 
     }, 
     typeAhead: { 
      deps: ['jquery'], 
      exports: 'jquery' // Make sure the noconflict configuration of jquery doesn't break this extension 
     }, 
     azimuth: { 
      deps: ['angular', 'jquery'], 
      exports: 'az' 
     } 
    } 
} 
); 

require(
[ 
    'angular', 
    'app', 
    'bootstrap', // This is not Twitter Bootstrap, but our own AngularJS Bootstrap 
    'controllers/rootController', 
    'services/searchService', 
    'directives/ngbkFocus' 
    // Any individual controller, service, directive or filter file that you to the app will also need to be added here. 
    // This is manual maintenance. Although maybe Yeoman could help. 
], 
function(angular, app) { 
    'use strict'; 

    app.config(['$routeProvider', 
     function($routeProvider) { 
      // Define your routes here 
     } 
    ]); 
} 
); 

// IE8 and below specific scripts 
if ($('html.lt-ie9').size()) { 
require(['/scripts/ie'], function(ieScript) { 
    // ... do stuff 
}); 
} 

HTML,-элемент index.html мое приложение выглядит следующим образом:

<!--[if lt IE 7]>  <html class="ie lt-ie10 lt-ie9 lt-ie8 lt-ie7"> <![endif]--> 
<!--[if IE 7]>  <html class="ie lt-ie10 lt-ie9 lt-ie8"> <![endif]--> 
<!--[if IE 8]>  <html class="ie lt-ie10 lt-ie9"> <![endif]--> 
<!--[if IE 9]>  <html class="ie lt-ie10><![endif]--> 
<!--[if !IE]><!--><html><!--<![endif]--> 

Итак ... как бы я идти о это? Могу ли я сделать условный запрос вызова так? Должен ли я поставить вызов в другое место?

С наилучшими пожеланиями, Мартейн Senden

ответ

3

Возможно, я думаю, что вам нужно обернуть его вокруг require.

require(['jquery'], function($) { 
    // IE8 and below specific scripts 
    if ($('html.lt-ie9').size()) { 
     require(['/scripts/ie'], function(ieScript) { 
     // ... do stuff 
     }); 
    } 
}); 
+0

Спасибо! Это работает! – Martijn

Смежные вопросы