ずぼらなのでblade内でscssが使いたくなります。
使い方
blade内で @scss と @endscss で挟んだ領域で、scssをcssに変換してくれます。
hoge.blade.php
<style>
@scss
p{
span{
i{
color:red;
}
}
}
@endscss
</style>
設定方法
leafo/scssphpをインストール
ScssServiseProvider
app/Providers/ScssServiseProvider
<?php
namespace App\Providers;
use Illuminate\Support\ServiceProvider;
use Illuminate\Support\Facades\Blade;
class ScssServiceProvider extends ServiceProvider
{
public function boot()
{
require app_path('../vendor/leafo/scssphp/scss.inc.php');
Blade::directive('scss', function ($expression) {
return '<?php $__env->startComponent(\'components.scss\'); ?>';
});
Blade::directive('endscss', function ($expression) {
return '<?php echo $__env->renderComponent(); ?>';
});
}
public function register()
{
//
}
}
config/app.php にProvider追加
config/app.php
'providers' => [
...
App\Providers\ScssServiceProvider::class,
...
scss.blade.php
resources/views/components.scss.blade.php
{!! (new scssc())->compile((string)$slot) !!}
