leafo / scssphp忽略子目录中的文件

MZH 发表于 Dev

MZH

leafo / scssphp可以正常工作，除了文件位于子目录中时，我尝试过addImportPath，但仍无法包含这些子目录文件，这是我的scss代码。

.my-parent-container {
    background-color: $body-background;
    @import './base/reset';
    @import './abstracts/placeholders';
    @import './base/typography';
    @import './layout/header';
    @import './components/buttons';
    @import './components/switch_button';
}

PHP代码

$scss = new \Leafo\ScssPhp\Compiler();
$scss_path = base_path('public/assets/tmpl-scss/style.scss');
$scss->setVariables($colors);
$css = $scss->compile('@import "'.$scss_path.'"');

未添加诸如reset，占位符，版式，标题，按钮和switch_button之类的文件。

谢谢

Cornel Raiu

从我在他们的文档中可以理解的内容：https : //scssphp.github.io/scssphp/docs/

使用@import指令导入文件时，默认情况下，PHP脚本的当前路径用作搜索路径。这通常不是您想要的，因此有两种方法可以处理导入路径：addImportPath和setImportPaths。

addImportPath（$ path）将$ path附加到搜索的导入路径列表中。

setImportPaths（$ pathArray）将用$ pathArray替换整个导入路径。如果$ pathArray的值还不是一个，它将被转换为一个数组。

所以，我会这样做：

$scss = new \Leafo\ScssPhp\Compiler();
$scss_path = base_path('public/assets/tmpl-scss/style.scss');
$scss->setImportPaths([
    'public/assets/tmpl-scss/'
    'public/assets/tmpl-scss/base/',
    'public/assets/tmpl-scss/abstracts/',
    'public/assets/tmpl-scss/layout/',
    'public/assets/tmpl-scss/components/',
]);
$scss->setVariables($colors);
$css = $scss->compile('@import "'.$scss_path.'"');

在CSS中：

.my-parent-container {
    background-color: $body-background;
}

@import 'reset';
@import 'placeholders';
@import 'typography';
@import 'header';
@import 'buttons';
@import 'switch_button';

另外，您可能想看一下源地图：https : //scssphp.github.io/scssphp/docs/#source-maps

我不确定这是否行得通，因为我从未亲自使用过Leafo ScssPhp。但是您可以尝试一下，这可能会为您提供一个起点。

本文收集自互联网，转载请注明来源。

如有侵权，请联系 [email protected] 删除。