Laravel与Bootstrap4的混合
我一直在学习 Laravel (8) 并且喜欢使用 tailwindcss。也就是说,我仍然希望使用 Bootstrap 做一些事情。我无法找到有关如何在 laravel 8 中使用 laravel mix 设置引导程序的文档。更具体地说,在resources/css/app.css文件中,我们将以下内容用于 tailwind:
@tailwind base;
@tailwind components;
@tailwind utilities;
但我不确定这里会有什么引导程序。
我注意到使用了旧版本的 Laravel,php artisan ui bootstrap但据我所见,这在 Laravel 8 中不可用。
回答
跑: npm install --save-dev bootstrap jquery popper.js
你webpack.mix.js应该怎么看:
const mix = require('laravel-mix');
mix.js('resources/js/app.js', 'public/js')
.sass('resources/sass/app.scss', 'public/css');
你app.scss应该怎么看:
@import '~bootstrap/scss/bootstrap';
@import '~bootstrap/scss/bootstrap';
你app.js应该怎么看:
这是您如何在文件中使用生成的.blade.php文件:
window.$ = window.jQuery = require('jquery');
window.Popper = require('popper.js');
require('bootstrap');
如果您想自定义 Bootstrap,请复制node_modules/bootstrap/scss/_variables.scss到resources/sass/_variables.scss,更改您想要的变量并将您的更改app.scss为:
@import '~bootstrap/scss/functions';
@import 'variables';
@import '~bootstrap/scss/bootstrap';
您在https://getbootstrap.com/docs/4.0/getting-started/webpack/上有一些有用的文档
Laracasts 也很有帮助。