Question

我对requirejs比较新。我正在尝试通过require加载我的IE依赖项，但前提是浏览器低于IE9。我正在尝试https://stackoverflow.com/a/11846837/1954860中建议的方法来加载IE依赖项。

问题是，加载此代码时，尚未定义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
});
}

我的应用程序的index.html的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]-->

所以......我怎么会这样做？我可以这样做一个有条件的需求电话吗？我应该把需求电话放在其他地方吗？

祝你好运， Martijn Senden

Answer 1

可能，我认为你需要将它包裹在require。

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

使用requireJS加载IE依赖项

1 个答案: