“不工作”是什么意思？
—
黑色
Answers:
要在自定义主题中的Magento 2.2.3（经测试）及更高版本中添加Bootstrap 4，请执行以下步骤
1）在Web文件夹中引导CSS文件
注意：
THEME_LOCATION=>app\design\frontend\vendor-name\theme-name\
THEME_LOCATION\web\css\bootstrap.css 在default_head_blocks中调用引导CSS文件
THEME_LOCATION\Magento_Theme\layout\default_head_blocks.xml添加CSS
<page xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:View/Layout/etc/page_configuration.xsd">
<head>
<!--Bootstrap css-->
<css src="css/bootstrap.css" />
</head>
</page>
2）以捆绑形式而不是个人的形式添加Js文件，因为个人不起作用
可从此处下载地方bootstrap.bundle.js文件
THEME_LOCATION\Magento_Theme\web\js\bootstrap.bundle.js将Bootstrap Js调用到requirejs-config.js
THEME_LOCATION\Magento_Theme\requirejs-config.js的代码
var config = {
paths: {
'bootstrap':'Magento_Theme/js/bootstrap.bundle',
} ,
shim: {
'bootstrap': {
'deps': ['jquery']
}
}
};
在已经存在的脚本标记之后，在header.phtml中添加以下代码
THEME_LOCATION\Magento_Theme\templates\html\header.phtml码：
<script type="text/javascript">require(['bootstrap']);</script>在命令下运行：
php bin/magento setup:static-content:deploy (Append -f if you are using Magento 2.2.x >= version)
php bin/magento cache:flush
注意：已在Magento 2.2.3和最新版本以及2.2.6上进行了测试。也在2.3.3上测试
更新：下载从此处编译的Bootstrap 并使用bundle js
您可以通过这种方式添加Bootstrap，请执行以下步骤： 注意：此解决方案不适用于Magento 2.2.3及更高版本
1）将您的JS和CSS放在下面的位置
/ app / design / frontend / vendor-name / theme-name / web / css
/ app / design / frontend / vendor-name / theme-name / web / js
2）调用default_head_blocks.xml中的文件
app/design/frontend/vendor-name/theme-name/Magento_Theme/layout/default_head_blocks.xml添加这些代码行
<css src="css/bootstrap.css" />
<script src="js/bootstrap.min.js"/>
3）运行以下命令
php bin/magento setup:upgrade
php bin/magento setup:static-content:deploy
您应该使用Bower Package Manager在主题Web文件夹中添加bootstrap 4。
为什么？ 因为有不断更新和易于管理。运行update命令，更新Bootstrap 4。
另外： 我们更喜欢将LESS或SCSS与bootstrap 4一起使用。它坚固且易于重构。
请按照以下步骤安装凉亭：
1）通过以下网址在各自的操作系统上安装LTS nodeJS：https：//nodejs.org/en/
2）全局安装Bower软件包管理器： npm install -g bower
3）git从以下位置安装：https：//git-scm.com/
4）安装引导程序4：
在web您的Magento自定义主题目录中
例如：打开终端在 <Magento root>/app/design/frontend/MyCustom/theme/web/
运行以下命令以安装引导程序4：
bower install bootstrap4
5）之后，您需要添加字体，在默认布局节点中引导CSS和引导JS，以Magento_Theme在自定义主题的模块的每个页面上使用boostrap 。
我们使用gulp将SCSS编译为CSS。
bower_components，以web使用.bowerrc配置文件。
package.jsonBootstrap 4的第一个打开文件，如果看到files数组键，则仅显示匹配的文件类型将添加到项目目录中。files键仅由Bower命令使用。如果要贡献或重新编译Bootstrap，则应尝试使用Yarn。因为它将为项目添加不必要的文件/目录。Webpack和Parcel用于节点项目，它们可以编译为JavaScript用于前端。
阅读以上答案后，我还有另一个建议：将Bootstrap 4放入模块中，并使用CDN链接Bootstrap文件。
我假设您知道如何创建基本模块。如果没有，你可以参考一下了这里。所以这是步骤：
app/code/Vendor/Module/view/frontend/layout/default_head_blocks.xml使用以下代码创建文件：
<?xml version="1.0"?>
<!--
/**
* Copyright © 2013-2017 Magento, Inc. All rights reserved.
* See COPYING.txt for license details.
*/
-->
<page xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:View/Layout/etc/page_configuration.xsd">
<head>
<link rel="stylesheet" type="text/css" src="https://stackpath.bootstrapcdn.com/bootstrap/4.1.1/css/bootstrap.min.css" integrity="sha384-WskhaSGFgHYWDcbwN70/dfYBj47jz9qbsMId/iRN3ewGhXQFZCSftd1LZCfmhktB" crossorigin="anonymous" src_type="url" />
<script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" crossorigin="anonymous" src_type="url"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.3/umd/popper.min.js" integrity="sha384-ZMP7rVo3mIykV+2+9J3UJ46jBk0WLaUAdn689aCwoqbBJiSnjAK/l8WvCWPIPm49" crossorigin="anonymous" src_type="url"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.1.1/js/bootstrap.min.js" integrity="sha384-smHYKdLADwkXOn1EmN1qk/HfnUcbVRZyYmZ4qpPea6sjB/pTJ0euyQp0Mk8ck+5T" crossorigin="anonymous" src_type="url"></script>
</head>
</page>
激活模块并运行setup:upgrade命令，仅此而已！
好处：
在Magento 2.2.4上进行了测试，但是应该可以在所有Magento 2.X版本中使用。EDIT *将链接标签href更改为src以与devdocs内联。参考：
The attribute 'integrity' is not allowed.