Uncaught Error: Script error for "popper.js", needed by: bootstrap - require.js
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)
使用require.js 模块化开发引入bootstrap 4.1.1 时会报错,如上,在网上找到一个解决办法,在配置require.js 时添加map参数,最终解决方案如下:
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'。
这是因为在Bootstrap里定义的是require('popper.js'), 而不是require标准的require('popper'), 所以要在map里做一个转换以让require.js识别。
以后遇到同类情况也可以用些方案解决。
参考:https://my.oschina.net/justplay/blog/2992283
Uncaught Error: Script error for "popper.js", needed by: bootstrap - require.js的更多相关文章
- [转]js模块化——AMD及require.js
由CommonJS组织提出了许多新的JavaScript架构方案和标准,希望能为前端开发提供统一的指引.AMD规范就是其中比较著名一个,全称是Asynchronous Module Definitio ...
- 分页器的js实现代码 bootstrap Paginator.js
参考: http://www.jb51.net/article/76093.htm 如前所述, 不要什么都想到 jquery的 脚本js, 应该首先推荐的是 css 和 元素本身的事件 函数 如: o ...
- js模块化开发——require.js的用法详细介绍(含jsonp)
RequireJS的目标是鼓励代码的模块化,它使用了不同于传统<script>标签脚本加载步骤.可以用它回事.优化代码,但其主要的目的还是为了代码的模块化.它鼓励在使用脚本以moudle ...
- Karma +Jasmine+ require JS进行单元测试并生成测试报告、代码覆盖率报告
1. 关于Karma Karma是一个基于Node.js的JavaScript测试执行过程管理工具(Test Runner). 该工具可用于测试所有主流Web浏览器,也可集成到CI(Continuou ...
- require.js实践
ASP.NET MVC应用require.js实践 这里有更好的阅读体验和及时的更新:http://pchou.info/javascript/asp.net/2013/11/10/527f6ec41 ...
- js模块化开发——require.js学习总结
1.为什么使用require.js 作为命名空间: 作为命名空间使用: 异步加载js,避免阻塞,提高性能: js通过require加载,不必写很多script 2.require.js的加载 requ ...
- require.js详解
一:什么是require.js ①:require.js是一个js脚本加载器,它遵循AMD(Asynchronous Module Definition)规范,实现js脚本的异步加载,不阻塞页面的渲染 ...
- javascript模块化编程库require.js的用法
随着javascript的兴起,越来越多的公司开始将JS模块化,以增加开发的效率和减少重复编写代码的.更是为了能更加容易的维护日后的代码,因为现在的随着人们对交互效果的越来越强烈的需求,我们的JS代码 ...
- require.js使用教程
require.js使用教程 下载require.js, 并引入 官网: http://www.requirejs.cn/ github : https://github.com/requirejs/ ...
随机推荐
- Javascript 学习 Boolean
构造函数 new Boolean(value) //构造函数 Boolean(value) //转换函数 参数 value 由布尔对象存放的值或者要转换成布尔值的值 返回值 当作为一个构造函数(带有运 ...
- 构建web应用
一.web服务器示例 var http = require('http'); http.createServer(function(req, res){ res.writeHeader(200, {C ...
- 关于node不需要重启即可刷新页面
之前写node程序每次修改后台代码都需要重新node xxx.js重启该文件,但是发现有一个supervisor的模块可以解决这个问题,需要npm install -g supervisor一下,然后 ...
- Java笔记 —— 方法重载和方法重写
Java笔记 -- 方法重载和方法重写 h2{ color: #4ABCDE; } a{ text-decoration: none !important; } a:hover{ color: red ...
- 【Node.js】一个愚蠢的Try Catch过错
前段时间学习<深入浅出Nodejs>时,在第四章 - 异步编程中作者朴灵曾提到,异步编程的难点之一是异常处理,书中描述"尝试对异步方法进行try/catch操作只能捕获当次事件循 ...
- 常见O/R框架介绍
1.hibernate(JPA的一个实现,同时也有自己的特色)2.toplink3.jdo4.ibatis 4.JPA a)意愿统一天下
- 关于Java虚拟机内存原型的基本知识
Java虚拟机内存原型的六个部分: 1.寄存器:我们在程序中无法控制 2.栈:存放基本类型的数据和对象的引用,但对象本身不存放在栈中,而是存放在堆中 3.堆:存放用new产生的数据 4.静态域:存放在 ...
- vue短信验证码组件
Vue.component('timerBtn',{ template: '<button v-on:click="run" :disabled="disabled ...
- Js parsetInt() 字符串转换,只能转换字符串,数字开头的才会返回数值,否则为NaN,空字符串也返回NaN
alert(parseInt('456lee')); //456,返回正数部分 alert(parseInt('lee456lee')); //NaN alert(parseInt('lee456le ...
- TP5.1:数据库的增删改查操作(基于数据库操作)
1.在app/index/controller文件夹下创建一个文件,名为:Operation 注意:起名一定要避开关键字,例如:mysql,curd等等,如果使用关键字起名,会造成报错! 在Opera ...