Uncaught Error: Script error for "popper.js", needed by: bootstrap
https://requirejs.org/docs/errors.html#scripterror
at makeError (require.js:168)
at HTMLScriptElement.onScriptError (require.js:1738)
这个错误是Bootstrap依赖popper.js组件导致的。bootstrap除了依赖jQuery还是部分插件依赖popper.js。
网上找了一个解决办法。
require(["popper"], function(popper) {
// set popper as required by Bootstrap
window.Popper = popper;
require(["bootstrap"], function(bootstrap) {
// do nothing - just let Bootstrap initialise itself
});
});
试了一下,问题还是未解决。
然后就从bootstrap中入手。
bootstrap中有前一段代码是这样的。
(function (global, factory) {
typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('popper.js'), require('jquery')) :
typeof define === 'function' && define.amd ? define(['exports', 'popper.js', 'jquery'], factory) :
(factory((global.bootstrap = {}),global.Popper,global.jQuery));
}(this, (function (exports,Popper,$) { 'use strict';
手动修改成requirejs中的配置,就 popper.js 改成 require paths中的popper对应的配置,我的配置是这样的,
'popper': 'popper.js/dist/umd/popper.min',
所以,直接将 bootstrap源码中的前几行 popper.js改成popper 即可解决问题。
但是总认为改变源码的这种方式不太妥当。于是又找解决办法。
最终的解决办法是这样的。
require.config({
baseUrl: '/vendors',
paths: {
'jquery': 'jquery/dist/jquery.min',
'bootstrap': 'bootstrap/dist/js/bootstrap',
'popper': 'popper.js/dist/umd/popper.min',
...
},
shim: {
'bootstrap': ['jquery']
},
map: {
'*': {
'popper.js': 'popper'
}
}
});
核心解决方案是:
在require的配置中 map 里加配置
'popper.js': 'popper'
后来遇到,
datatables.net-bs4依赖datatables.net的解决方案也是同上。
在map中加一行配置:
'datatables.net': 'datatables'