Encore Webpack Bootstrap4.5导航条不工作



我正在努力学习Symfony。我正在使用bootstrap样式我的页面。当我在base.html.twig中添加此链接<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.0.0-beta1/dist/js/bootstrap.bundle.min.js" integrity="sha384-ygbV9kiqUc6oa4msXn9868pTtWMgiQaeYH7/t7LECLbyPA2x65Kgf80OJFdroafW" crossorigin="anonymous"></script>时,导航条工作正常。但是当我使用npm安装jquery和使用{{ encore_entry_script_tags('app') }}我的导航条不再工作了。知道我可以在屏幕上看到引导主题可能是有用的,所以我认为scss部分正在工作。

这是我的app.js文件

import './styles/app.scss';
import $ from 'jquery';
global.$ = global.jQuery = $;
import greet from './greet';
// start the Stimulus application
import './bootstrap';
import 'bootstrap/dist/js/bootstrap.min.js';
import 'bootstrap/dist/css/bootstrap.min.css';
$(document).ready(function() {
$('body').prepend('<h1>'+greet('mj')+'</h1>');
});

greet函数正在工作,消息正在显示。

webpack.config.js

在这个文件中,我使用enableSassLoader()来激活Sass和autoProvidejQuery()来访问jQuery作为一个全局变量。

你知道怎么回事吗?谢谢你的帮助。

我为遇到同样问题的人找到了解决方案。我有Bootstrap 4.5,所以我只是做了npm install bootstrap@next -D,安装了Bootstrap 5,一切都工作了

最新更新