jQuery Bootstrap - 未捕获的类型错误：无法读取未定义的属性“fn”
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/20606209/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Bootstrap - Uncaught TypeError: Cannot read property 'fn' of undefined
提问by Mohammad Nurdin
I'm using jquery, backbonejs, underscorejs and bootstrap for my company project. Sometimes I got this error in chrome.
我正在为我的公司项目使用 jquery、backbonejs、underscorejs 和 bootstrap。有时我在 chrome 中遇到这个错误。
Uncaught TypeError: Cannot read property 'fn' of undefined
未捕获的类型错误：无法读取未定义的属性“fn”
My shim is like this in my main.js
我的 shim 在我的 main.js 中是这样的
require.config({
paths: {
jquery: 'libs/jquery/jquery',
underscore: 'libs/underscore/underscore',
backbone: 'libs/backbone/backbone',
backboneeventbinder: 'libs/backbone.eventbinder.min',
bootstrap: 'libs/bootstrap',
jquerytablesorter: 'libs/tablesorter/jquery.tablesorter',
tablesorter: 'libs/tablesorter/tables',
ajaxupload: 'libs/ajax-upload',
templates: '../templates'
},
shim: {
'backbone': {
deps: ['underscore', 'jquery'],
exports: 'Backbone'
},
'underscore': {
exports: '_'
},
}
});
require(['app', ], function(App) {
App.initialize();
});
I already insert .noConflict() for jquery, underscorejs and backbonejs.
我已经为jquery、underscorejs 和backbonejs 插入了.noConflict()。
My app.js
我的 app.js
// Filename: app.js
define(['jquery', 'underscore', 'backbone', 'backboneeventbinder', 'bootstrap', 'ajaxupload', 'router', // Request router.js
], function($, _, Backbone, Bootstrap, Backboneeventbinder, Ajaxupload, Router) {
$.noConflict();
_.noConflict();
Backbone.noConflict();
var initialize = function() {
Router.initialize();
};
return {
initialize: initialize
};
});
This is screenshot from my chrome
这是我的 chrome 截图
Its kind like related to bootstrap.
它有点像与引导程序有关。
Thanks a lot in advance.
非常感谢。
回答by Mohammad Nurdin
You need to load jquery first before bootstrap.
您需要在引导之前先加载 jquery。
require.config({
paths: {
jquery: 'libs/jquery/jquery',
underscore: 'libs/underscore/underscore',
backbone: 'libs/backbone/backbone',
bootstrap: 'libs/bootstrap',
jquerytablesorter: 'libs/tablesorter/jquery.tablesorter',
tablesorter: 'libs/tablesorter/tables',
ajaxupload: 'libs/ajax-upload',
templates: '../templates'
},
shim: {
'backbone': {
deps: ['underscore', 'jquery'],
exports: 'Backbone'
},
'jquery': {
exports: '$'
},
'bootstrap': {
deps: ['jquery'],
exports: '$'
},
'jquerytablesorter': {
deps: ['jquery'],
exports: '$'
},
'tablesorter': {
deps: ['jquery'],
exports: '$'
},
'ajaxupload': {
deps: ['jquery'],
exports: '$'
},
'underscore': {
exports: '_'
},
}
});
require(['app', ], function(App) {
App.initialize();
});
Works like charm! quick and easy fix.
像魅力一样工作！快速简便的修复。
回答by Duc Babe
My way is importing the jquery library.
我的方法是导入 jquery 库。
<script
src="https://code.jquery.com/jquery-3.3.1.js"
integrity="sha256-2Kok7MbOyxpgUVvAk/HJ2jigOSYS2auK4Pfzbm7uH60="
crossorigin="anonymous"></script>
回答by Rokive
solve this issue for angular
解决这个角度问题
"styles": [
"src/styles.css",
"node_modules/bootstrap/dist/css/bootstrap.min.css"
],
"scripts": [
"node_modules/jquery/dist/jquery.min.js",
"node_modules/bootstrap/dist/js/bootstrap.min.js"
]
回答by Airan
//Call .noConflict() to restore JQuery reference.
jQuery.noConflict(); OR $.noConflict();
//Do something with jQuery.
jQuery( "div.class" ).hide(); OR $( "div.class" ).show();
回答by Daniel00127
I went back to jquery-2.2.4.min.js and it works.
我回到 jquery-2.2.4.min.js 并且它有效。
