Question

鉴于我想在magento 2.2.2框架内使用https://getbootstrap.com/ javascript。

我做了以下事情： 1.下载最新版本的bootstrap和popper（依赖项），我的requirejs-config.js看起来如下

var config = {
deps: [
    'js/popper.min',
    'js/bootstrap'
],
shim: {
    'js/bootstrap': {
// These script dependencies should be loaded before loading 'jquery/slick'
        deps: ['jquery', 'js/bootstrap']
    }
}

};

Bootstrap v4.1.1

文件已成功部署，但首先想到的是默认情况下bootstrap不会将javascript应用于它的元素，例如从引导页面获取的示例

<div class="container">
<h2>Alerts</h2>
<p>The button with class="close" and data-dismiss="alert" is used to close the alert box.</p>
<p>The alert-dismissible class adds some extra padding to the close button.</p>
<div class="alert alert-success">
    <button type="button" class="close" data-dismiss="alert">×</button>
    <strong>Success!</strong> This alert box could indicate a successful or positive action.
</div>

我认为它没有正确初始化，所以当我尝试以下任何一个

时

<script type="text/javascript">
require(['jquery', 'js/bootstrap'], function($) {console.log('Ahem1')})
require(['js/bootstrap'], function($) {console.log('Ahem2')})
require(['jquery', 'js/bootstrap'], function($) {
    $('.alert.alert-success').alert();
    $('.alert.alert-success').on('closed.bs.alert', function () {
        console.log('i am closed');
    })
})

没有控制台日志有效，当我尝试require(['jquery', 'js/popper', 'js/bootstrap']它也不起作用但是当我require(['jquery', 'js/popper']时，我可以看到控制台日志工作。

之前有人测试过吗？抱歉我的格式错误，这是我的第一个问题。

Answer 1

猜猜我是magento2的新手，也许有人会觉得它很有用，所以这就是：

requiresjs-config.js

var config = {
    deps: [
        'js/popper.min',
        'js/bootstrap',
    ],
    shim: {
        'js/bootstrap': {
    // These script dependencies should be loaded before loading 'jquery/slick'
            deps: ['jquery', 'js/popper.min']
        }
    }
};

然后更新bootstrap.js中的路径，在那里需要或定义popper使用popper.min。

在Magento 2中使用GetBootstrap

1 个答案: