-
Notifications
You must be signed in to change notification settings - Fork 214
Source Maps
dleffler edited this page Jul 4, 2018
·
4 revisions
Here is some info on outputting source maps with scssphp. Source Maps are useful in debugging compiled css files using browser developer tools.
$scss_fname = '/framework/scss/test.scss'; // input file
$css_fname = '/framework/css/test.css'; // output file
$vars = array(); // scss variables to pass
include_once('scss.inc.php');
$scss = new \Leafo\ScssPhp\Compiler();
$scss->setSourceMap(Compiler::SOURCE_MAP_FILE); // SOURCE_MAP_NONE, SOURCE_MAP_INLINE, or SOURCE_MAP_FILE
$scss->setSourceMapOptions(array(
// absolute path to write .map file
'sourceMapWriteTo' => '/srv/www/tmp/css/' . str_replace("/", "_", $scss_fname) . ".map",
// relative or full url to the above .map file
'sourceMapURL' => '/tmp/css/' . str_replace("/", "_", $scss_fname) . ".map",
// (optional) relative or full url to the .css file
'sourceMapFilename' => $css_fname, // url location of .css file
// partial path (server root) removed (normalized) to create a relative url
'sourceMapBasepath' => '/srv/www', // difference between file & url locations, removed from ALL source files in .map
// (optional) prepended to 'source' field entries for relocating source files
'sourceRoot' => '/',
));
$scss->setVariables($vars);
$css = $scss->compile(file_get_contents($scss_fname), $scss_fname); // this call takes care of saving/embedding the map file
file_put_contents($css, $css_fname); // save the compiled css file