Я провел обширное исследование, прежде чем опубликовать эту проблему, и чувствую, что исчерпал онлайн-документацию и переполнение стека.
Моя проблема:
Я использую npm версии bootstrap с помощью сценария выбора времени и времени tempus dominus и получения ошибки $ (...). modal не является функцией, даже если jQuery импортируется до bootstrap, а затем используется для фактического импорта bootstrap в бэкэнд, например, так :
const ipcRenderer = require('electron').ipcRenderer
const jQuery = require('jQuery');
const $ = require('jQuery');
require('popper.js')
const moment = require('moment')
$(document).ready(() => {
ipcRenderer.send('page-ready');
moment().format();
$.getScript("./js/tempusdominus-bootstrap-4.min.js", function() {
$(function () {
$('#datetimepicker1').datetimepicker({
format: 'YYYY-MM-DD HH:mm'
});
});
$(function () {
$('#datetimepicker2').datetimepicker({
format: 'YYYY-MM-DD HH:mm'
});
});
})
require("bootstrap")
});
Вещи, которые я пробовал:
Итак, после некоторых исследований я обнаружил, что это может быть связано с тем, что jQuery был импортирован дважды, чтобы заставить другой скрипт js работать правильно, поэтому я исправил изменив мой код на:
const ipcRenderer = require('electron').ipcRenderer
const jQuery = require('jQuery');
const $ = jQuery.noConflict();
require('popper.js')
const moment = require('moment')
$(document).ready(() => {
ipcRenderer.send('page-ready');
moment().format();
$.getScript("./js/tempusdominus-bootstrap-4.min.js", function() {
$(function () {
$('#datetimepicker1').datetimepicker({
format: 'YYYY-MM-DD HH:mm'
});
});
$(function () {
$('#datetimepicker2').datetimepicker({
format: 'YYYY-MM-DD HH:mm'
});
});
})
require("bootstrap")
});
Код, где называется модал:
ipcRenderer.on("edit-self-result", (event, arg) => {
if (arg == false) {
$('#editMemberModal').modal('toggle');
document.getElementById("userTypeEdit").value = usertype
document.getElementById("usernameEdit").value = username
document.getElementById("emailEdit").value = email
}
})