'Project throws Uncaught TypeError: s.fn.modal is undefined

When I set up a bootstrap5-dialog project in nodejs, there will be thrown an error message:Uncaught TypeError: s.fn.modal is undefined when the main index page is loading. Please could someone make any suggestons? Thnaks

index.js

import $ from "jquery";
import bootstrap from 'bootstrap'
import BootstrapDialog from 'bootstrap5-dialog'

index.html

<head>
    <title>Bootstrap5 Dialog Page Example</title>
    <link rel="stylesheet" href="vendor/bootstrap/dist/css/bootstrap.css" />
    <link rel="stylesheet" href="vendor/bootstrap5-dialog/dist/css/bootstrap-dialog.css" />
</head>

error message in firefox console:

Uncaught TypeError: s.fn.modal is undefined
js bootstrap-dialog.js:1
js bootstrap-dialog.js:1
js bootstrap-dialog.js:1
Webpack 4

enter image description here

npmbootstrap-5bootstrap-dialog


Solution 1:[1]

in package.json file, changed these two lines:

"bootstrap": "^5.1.3",

"bootstrap5-dialog": "^5.0.1",

to

"bootstrap": "^4.5.0",

"bootstrap5-dialog": "^5.0.1",

It works fine in my project without previous error message.

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source
Solution 1 Bes Ley

Related Questions