如何正确地使用Bootstrap 4（Sass）设置Laravel？

Question

我有一个关于如何使用Bootstrap 4与Sass和Laravel的正确方式的疑问。是只需下载源文件并将其放入public文件夹中，还是最好使用npm？

对于每种情况，配置Bootstrap与Laravel的过程应该是什么?

对于只下载源文件的情况，我们可以创建一个像/public/css/bootstrap这样的文件夹，并将源文件文件夹中的Sass文件粘贴到其中吗？但是然后如何在html文件中导入css呢？

对于使用npm的情况，您知道一些可行的教程吗？看起来有很多方法，但是否有一些推荐的过程适用于此？我使用项目文件夹中的命令npm install bootstrap@4.0.0-beta.2，然后在bootstrap.js中将"bootstrap-sass"更改为"bootstrap"，然后在app.scss中将第三个导入更改为"@import "node_modules/bootstrap/scss/bootstrap"。我不知道这个过程是否正确，但如果它是正确的，则如何编辑布局，Bootstrap CSS文件应该在node_modules中的Bootstrap文件夹内进行编辑还是应该将该Bootstrap文件夹复制到public文件夹内？

- user9133911

Answer 1

以下是我如何操作的

首先，清除您将不再使用的内容

yarn remove bootstrap-sass

然后安装您需要的内容

yarn add bootstrap@4.0.0-beta.3 popper.js

现在打开resources/assets/bootstrap.js（与我们讨论的Bootstrap无关）

查找

require('bootstrap-sass');

替换它为

window.Popper = require('popper.js');
require('bootstrap');

然后前往 resources/assets/sass/app.scss 查找

@import "~bootstrap-sass/assets/stylesheets/bootstrap";

并将其替换为

@import "~bootstrap/dist/css/bootstrap";

就是这样！

你应该能够运行yarn run dev或yarn run watch，并看到更改生效。

- Souljacker