Bootstrap - Uncaught TypeError: Cannot read property 'fn' of undefined

uncaught typeerror: cannot read property 'fn' of undefined angular 8
uncaught typeerror: cannot read property of undefined jquery
cannot read property 'bootstrap' of undefined
uncaught typeerror cannot read property 'fn' of undefined owl carousel
cannot read property 'getselectorfromelement' of undefined
uncaught typeerror: cannot set property 'popper' of undefined
uncaught typeerror cannot read property 'fn' of undefined fullcalendar
cannot read property 'webkit' of undefined

I'm using jquery, backbonejs, underscorejs and bootstrap for my company project. Sometimes I got this error in chrome.

Uncaught TypeError: Cannot read property 'fn' of undefined

My shim is like this in my 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.

My 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

Its kind like related to bootstrap.

Thanks a lot in advance.

You need to load jquery first before bootstrap.

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.

[SOLVED] Bootstrap: "Uncaught TypeError: Cannot read property 'fn , I connected all the dependencies following this instruction. However, on startup I get an error: [bootstrap.min.js:6]: Uncaught TypeError: Cannot read property 'fn'  Uncaught TypeError: Cannot read property "getTime" of undefined This error thrown when you haven't included the jQuery UI plugin. Make sure you include it before any other scripts in your project except after the jQuery plugin.

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"
            ]

Uncaught TypeError: Cannot read property 'fn' of undefined at , Trying to work with Bootstrap 4 and Angular 6. I got "Uncaught TypeError: Cannot read property 'fn' of undefined at setTransitionEndSupport  Uncaught TypeError: Cannot read property 'addEventListener' of null at Object.Waves.init (mdb.js:5059) at mdb.js:5181 This is the unminified

My way is importing the jquery library.

<script
  src="https://code.jquery.com/jquery-3.3.1.js"
  integrity="sha256-2Kok7MbOyxpgUVvAk/HJ2jigOSYS2auK4Pfzbm7uH60="
  crossorigin="anonymous"></script>

Cannot read property 'fn' of undefined · Issue #449 · understrap , I am facing this error : Uncaught TypeError: Cannot read property 'fn' of Is fixed since latest Bootstrap 4 integration (UnderStrap 0.8.0). (2)dataTables.bootstrap.min.js:5 Uncaught TypeError: Cannot read property 'defaults' of undefined at dataTables.bootstrap.min.js:5 This question has accepted answers - jump to:

//Call .noConflict() to restore JQuery reference.

jQuery.noConflict(); OR  $.noConflict();

//Do something with jQuery.

jQuery( "div.class" ).hide(); OR $( "div.class" ).show();

?page=2:140 Uncaught TypeError: Cannot read property , Uncaught TypeError: Cannot read property 'addEventListener' of null at Object.t.​init (mdb.min.js:4) at mdb.min.js:4I'm getting this error and I need help figuring  Uncaught TypeError: Cannot read property 'defaults' of undefined at HTMLDocument.<anonymous> #2451 noblemfd opened this issue Dec 18, 2019 · 3 comments Labels

I went back to jquery-2.2.4.min.js and it works.

Uncaught TypeError: Cannot read property 'addEventListe, while using bootstrap 4 we usually get this kind of error and jquery bootstrap.min.​js is working correctly Error is: Uncaught TypeError: Cannot read property 'fn' of  3.3.7: Calling "destroy" twice on a shown tooltip or popover causes "Uncaught TypeError: Cannot read property 'off' of null" #20511 lddubeau opened this issue Aug 12, 2016 · 9 comments Labels

Uncaught TypeError: Cannot set property 'Bridge' of undefined , Uncaught TypeError: Cannot read property 'call' of undefined Vuejs (index.js:1) at r (bootstrap:84) at Module.56d7 (app.8a6bae16.js:1) at r  React - uncaught TypeError: Cannot read property 'setState' of undefined Hot Network Questions Making my Chicken Madras more savoury

Bootstrap 4 Uncaught TypeError: Cannot read property 'fn' of , Eonasdan / bootstrap-datetimepicker. Watch 286 Star 6.7k Fork 4.5k Uncaught TypeError: Cannot read property 'dateFormat' of undefined #592. Closed

Uncaught TypeError: Cannot read property 'call' of undefined Vuejs, This does indeed seem to resolve the problem. Although I'm wondering if this is the correct solution? I've read the referenced issue #3065062: Getting "Uncaught TypeError: Cannot read property 'prototype' of undefined" and noticed markcarver saying that this is a dependency issue.

Comments
  • How to use 'noConflict'?
  • This answer may perhaps be useful
  • True you need to load the jquery first :D
  • you should specify when to call noConflict(): just after including jQuery. api.jquery.com/jQuery.noConflict