表題の通りで、SOY CMSでSCSSコンパイラを実装しました。

同梱したライブラリはscssphpになります。

SCSS Compiler in PHP - scssphp


どのような機能か？は利用方法を介して見ていきます。

説明はサイトIDをsiteにして進めます。


はじめにscssのファイルを用意します。

/ドキュメントルート/site/scss/style.scss

※SCSSの記述は他のサイトを参照に用意してください。


次にページ出力時にscssファイルをコンパイルして表示するモジュールを作成します。

SOY CMSで作成したページに下記のモジュールの記述を挿入しておきます。

<!-- cms:module="css.scss" --><link rel="stylesheet" href="/site/css/style.css"><!-- /cms:module="css.scss" -->

続いて、PHPモジュールを使用する(要PHP) - SOY CMSを使ってみように記載されている機能を用いて、CSSコンパイラ用のモジュールを作成してみます。

※PHP許可モードにする必要はありません。


site
├── .module
│	└── css
│		└── scss.php
├── css
├── files
├── im.php
├── image
├── index.php
├── js
└── scss
	└── style.scss

※太字の箇所が今回の説明用に追加したディレクトリとファイル


/ドキュメントルート/site/.module/css/scss.php

を下記のようなコードにします。

<?php
function soycms_scss($html,$htmlObj){
	if(!function_exists("soycms_compile_scss")) SOY2::import("site_include.func.css", ".php");

	$in = _SITE_ROOT_ . "/scss/style.scss";
	$out = _SITE_ROOT_ . "/css/style.css";
	
	soycms_compile_scss($in, $out);

	echo $html;
}
?>

これでSCSSファイルの直接読み込みの手続きは終了です。

ページを開いて、style.scssに記述されている内容が反映されているかを確認しましょう。


今回紹介した機能を含んだパッケージは下記のサイトからダウンロード出来ます。

https://saitodev.co/soycms/


追記

style.scssの@importの記述に誤りがないのに、style.cssが空文字で生成される場合、

/ドキュメントルート/CMSインストールディレクトリ/common/site_include/func/vendor/scssphp/scssphp/bin/pscss

に実行権限を与えるとうまくいくかも