如何将 SASS/SCSS 文件和 CSS 文件组合成 laravel 混合中的单个 CSS 文件？

Question

我正在尝试将几个 SASS 文件和 CSS 文件组合成 Laravel 组合中的单个 CSS 文件，但我找不到如何组合。

这是我尝试使用的 laravel 混合示例 return 错误：

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

Answer 1

你可以在sass文件上导入CSS文件，如果可行的话只编译主sass文件。发现这可能对您有帮助：.
您可以合并 CSS 个文件。这是我用过的一个例子。也许您可以将 sass 编译为 CSS，然后使用此方法进行合并？

请检查样本

//combine CSS    
    mix.styles([
        'resources/css/open-iconic-bootstrap.min.css',
        'resources/css/animate.css',
        'resources/css/bootstrap-datepicker.css',
    ], 'public/css/essentials.css');

为了答案的完整性，可以对 js 文件使用如下相同的方法，

// combine required js files
mix.combine([
        'resources/js/vendors/jquery-migrate.min.js',
        'resources/js/vendors/jquery.easing.1.3.js',
        'resources/js/vendors/bootstrap-datepicker.js',
        'resources/js/vendors/scrollax.min.js'
    ], 'public/js/essentials.js');

在您的 webpack.mix.js

上使用此方法

如何将 SASS/SCSS 文件和 CSS 文件组合成 laravel 混合中的单个 CSS 文件？

How to combine SASS/SCSS files and CSS files into a single CSS file in laravel mix?

css

php

laravel

webpack

laravel-mix