Question

如何将纯CSS和Sass文件与Laravel Elixir结合使用？如果我运行以下代码，那么两个文件＆＃34; all.css＆＃34;和＆＃34; app.css＆＃34;在public/CSS/目录上生成。但是，我只想生成一个all.css的CSS文件。你们知道做任何技巧吗？

elixir(function (mix) {
    mix.sass([
            'app.scss'
        ])
        .styles([
            'owl.carousel.css'
        ]);
})

Answer 1

我通常这样做。目录结构：

/public
    /css 
        all.css
/resources
    /css
        app.css
    /sass
        app.scss

代码应如下所示：

elixir(function (mix) {
    mix.sass([
        'app.sass'
    ], 'resources/assets/css/custom.css')
    .styles([
        '/resources/assets/css/app.css',
        '/resources/assets/css/custom.css',
    ], 'public/css/all.css', __dirname);
})

这将首先在 /resources/assets/css/custom.css 中创建custom.css文件，然后此文件夹中的所有css文件将合并到位于 / public的一个文件中/ CSS

Answer 2

可能不像分离目录一样干净，但是SASS文件会编译成CSS文件，所以理论上你可以将普通的css文件传递给elixir混音器：

mix.sass(['app.scss', 'jumbotron-narrow.scss', 'datepicker_standalone3.css']);

最终结果是相应公共目录中的单个app.css文件。

使用Laravel Elixir将Sass和普通CSS组合成一个文件

2 个答案: