Я пытаюсь использовать шаблон bootstrap с моим приложением rails. Я добавил все css файлы (папки с именем css и vendor) шаблона в каталог app/assets/stylesheets
и импортировал их в мое приложение. Файл css выглядит так:
/*
*= require_tree .
*= require_self
*/
@import 'css/bootstrap.css';
@import 'vendors/linericon/style.css';
@import'css/font-awesome.min.css';
@import'css/themify-icons.css';
@import'css/flaticon.css';
@import'vendors/owl-carousel/owl.carousel.min.css';
@import'vendors/lightbox/simpleLightbox.css';
@import'vendors/nice-select/css/nice-select.css';
@import'vendors/animate-css/animate.css';
@import'vendors/jquery-ui/jquery-ui.css';
@import'css/style.css';
@import'css/responsive.css';
, затем я добавили js файлы в каталог 'App / javascripts / packs' и потребовали их в моем приложении. js примерно так:
require("@rails/ujs").start()
require("turbolinks").start()
require("@rails/activestorage").start()
require("channels")
require("./js/jquery-3.2.1.min.js")
require("./js/popper.js")
require("./js/bootstrap.min.js") //error in this file
require("./js/stellar.js")
require("./vendors/lightbox/simpleLightbox.min.js")
require("./vendors/nice-select/js/jquery.nice-select.min.js")
require("./vendors/isotope/imagesloaded.pkgd.min.js")
require("./vendors/isotope/isotope-min.js")
require("./vendors/owl-carousel/owl.carousel.min.js")
require("./js/jquery.ajaxchimp.min.js")
require("./vendors/counter-up/jquery.waypoints.min.js")
require("./vendors/counter-up/jquery.counterup.js")
require("./js/mail-script.js")
require("./js/theme.js")
, поэтому, когда я запускаю rails s
и открываю проект в мой браузер, тема не работает правильно. когда я проверял инструменты разработчика, консоль (chrome dev tool console) показала эту ошибку:
Uncaught Error: Cannot find module 'jquery'
at webpackMissingModule (bootstrap.min.js:formatted:1)
at bootstrap.min.js:formatted:1
at Object../app/javascript/packs/js/bootstrap.min.js (bootstrap.min.js:formatted:1)
at __webpack_require__ (bootstrap.min.js:formatted:1)
at Object../app/javascript/packs/application.js (bootstrap.min.js:formatted:1)
at __webpack_require__ (bootstrap.min.js:formatted:1)
at bootstrap.min.js:formatted:1
at bootstrap.min.js:formatted:1
Так что в моем bootstrap .min. js:
есть утверждение
"object" == typeof exports && "undefined" != typeof module ? e(exports, require("jquery"), require("popper.js")) : "function" == typeof define && define.amd ? define(["exports", "jquery", "popper.js"], e) : e(t.bootstrap = {}, t.jQuery, t.Popper)
этот оператор вызывает проблему. Мой проект - проект rails 6 с веб-пакетом.
Во-первых, этот файл работает без ошибок при индексировании шаблона. html импорт с тегом скрипта. Итак, почему это дает проблему с рельсами. Плюс, как мне решить это?
Спасибо заранее