Bootstrap – Uncaught TypeError: kan eigenschap ‘fn’ van undefined niet lezen

Ik gebruik jQuery, backbonejs, underscorejs en bootstrap voor mijn bedrijfsproject. Soms kreeg ik deze fout in chrome.

Uncaught TypeError: kan eigenschap ‘fn’ van undefined niet lezen

Mijn shim is zo in mijn 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();
});

Ik heb al .noConflict() ingevoegd voor jQuery, underscorejs en backbonejs.

Mijn 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
    };
});

Dit is een screenshot van mijn chrome

Het lijkt een beetje op bootstrap.

Bij voorbaat hartelijk dank.

Antwoord 1, autoriteit 100%

Je moet eerst jQuery laden voor 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();
});

Werkt als een tierelier! snelle en gemakkelijke reparatie.

Antwoord 2, autoriteit 6%

los dit probleem op voor hoekige

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

Antwoord 3, autoriteit 6%

Mijn manier is om de jQuery-bibliotheek te importeren.

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

Antwoord 4, autoriteit 3%

Om dit probleem op te lossen, roept u gewoon jQuery-bestand op vóór het bootstrap-bestand

Antwoord 5, autoriteit 2%

//Call .noConflict() to restore JQuery reference.
jQuery.noConflict(); OR  $.noConflict();
//Do something with jQuery.
jQuery( "div.class" ).hide(); OR $( "div.class" ).show();

Antwoord 6, autoriteit 2%

Importeer jQuery eerst voor bootstrap:

<script src="js/jquery.min.js"></script>
<script src="js/bootstrap.js"></script>
<script src="js/bootstrap.bundle.js"></script>

Antwoord 7

Ik ging terug naar jquery-2.2.4.min.js en het werkt.

Antwoord 8

Ik had hetzelfde probleem. Firefox liet me deze fout zien, maar in Chrome was alles in orde.
daarna gebruikte ik na een Google-zoekopdracht google cdn voor jQuery in index.html in plaats van het lokale js-bestand te laden en het probleem was opgelost.

Antwoord 9

Ik had hetzelfde probleem. In mijn geval heb ik alle 3 de links gewijzigd in andere versies van bootstrap en ben ik van die fout afgekomen. Ik heb 4.5 veranderd in 4.6