Question

我试图在RequireJS中使用Bootstrap，设置RequireJS＆＃39;像这样配置：

JS /
- bootstrap.min.js
- app.js
- require.js
- scripts.js

这是app.js文件：

requirejs.config({ 
  "shim": { 
    "bootstrap": {deps : 'jquery' } 
  }, 
  "paths": { 
    "jquery": "//ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min", 
    "bootstrap" : "bootstrap.min" 
  }, 
  enforceDefine : true 
});

// Load the main app module to start the app 
requirejs(["scripts"]);

这是scripts.js文件：

define(["jquery", "bootstrap"], function($) {
    console.log(jQuery);
    $('#video').click(function () {
    var src = 'http://www.youtube.com/v/FSi2fJALDyQ&amp;autoplay=1';
        $('#myModal').modal('show');
        $('#myModal iframe').attr('src', src);
    });  
    $('#myModal button').click(function () {
        $('#myModal iframe').removeAttr('src');
    });
});

这不起作用，并且在控制台上说Bootstrap需要jQuery才能工作。奇怪的是，如果我改变Bootstrap的路径从CDN加载它，它的工作原理。

Answer 1

Bootstrap的填充程序应使用数组来指定依赖项：

shim: { 
    "bootstrap": {
        deps : ['jquery'] // Use an array even with a single dependency.
    } 
}

现在的方式RequireJS没有获得您指定的依赖项。（它可能会将字符串解释为数组并查找模块j，q等。我不确定这个...）因此无论是否加载了jQuery，它都会加载Bootstrap。 / p>

当您使用CDN时，它可能会因为时序差异而起作用：在加载Bootstrap之前，需要花费足够长的时间来从CND中获取jQuery。当你在本地执行它时，Boostrap加载太快并且尚未加载jQuery。无论如何，如上所示使用数组应该可以解决问题。

Answer 2

感谢您的帮助，当我下载RequireJS时，我从未意识到我使用的是什么版本我以为我有最新的但我使用1.0.8，我升级了，现在我有2.1.14，这解决了问题。不需要在shim对象上使用导出，因为许多条目都说

shim: { 
    "bootstrap": {
        deps : ['jquery'], // Use an array even with a single dependency.  
        export : '$.fn.modal'
    } 
}

感谢您的帮助：D

RequireJS和本地bootstrap.js文件无法正常工作

2 个答案: