Laravel Mix在app.css捆绑包中不包含bootswatch

Question

[我试图在我的laravel / react项目中平放bootswatch主题，无论我做什么，bootwatchwatch的css都不会像我期望的那样出现在public / app.css文件中。

我运行了npm i bootswatch，并且已经验证我的bootswatch：我的package.json文件中的^ 4.4.1。我还运行了npm install。

最初设置项目时，我也运行了这些命令：

composer require laravel/ui
php artisan ui bootstrap
php artisan ui react

app.scss

根据docs，您可以这样设置导入：

@import "~bootswatch/dist/flatly/variables";
@import "~bootstrap/scss/bootstrap";
@import "~bootswatch/dist/flatly/bootswatch";

webpack.mix.js

mix.react('resources/js/app.js', 'public/js').extract('jquery');
mix.sass('resources/sass/app.scss', 'public/css');
mix.styles('resources/css/custom.css', 'public/css/custom.css');

if (mix.inProduction()) {
   mix.version();
}

app.blade.php

<script src="{{ mix('js/manifest.js') }}" defer></script>
<script src="{{ mix('js/vendor.js') }}" defer></script>
<script src="{{ mix('js/app.js') }}" defer></script>

<link href="{{ mix('css/app.css') }}" rel="stylesheet">
<link href="{{ mix('css/custom.css') }}" rel="stylesheet">

[当我在新标签页中打开app.css文件并搜索bootswatch时，我什么也没想到，样式也没有应用到页面上。我想念什么？

我已经清除了缓存，还运行了php artisan cache:clear，尽管不确定是否适用。此时几乎要尝试任何事情。

Bootstrap css已包含在public/css/app.css文件中。

Answer 1

答案是注释掉Laravel生成的app.scss文件中的这一行：

//@import 'variables';

尽管它似乎首先干扰了app.scss文件，但它似乎干扰了添加bootswatch样式或覆盖它们，这使我认为它会被之后添加的任何内容所覆盖。