Yii 1.1: lessclientscript

An extension to CClientscript so it parses Less CSS when using registerCSSFile
4 followers

With this extension, you can use Less CSS files with registerCSSFile.

The code is based on zsoltlengyelits, LessCSS-for-Yii extension. I've updated it so,

  • it uses the assetsfolder defined by CAssetmanager
  • You have a global caching setting, instead of per file
  • Updated to the latest lessc parser which includes a compress css feature
  • It uses CClientscript to register the outputted css automatically

Requirements

Yii 1.1 or above

Usage

Copy the folder to your extension folder (protected/extensions).

Extend CClientscript:

'components' => array(
        'clientScript' => array(
            'class' => 'ext.LessClientscript.LClientscript',
            'caching' => true, //use the cached css file if available
            'compress' => false, //remove whitespace and linearize to 1 line
        )
    );

Done!

Now you can add it in your view or controller:

Yii::app()->clientScript->registerCSSFile('src/app/admin/stylesheets/test.less');

Resources

Update

V1.02 - Store temporary less file in runtime folder - Fixed bug where if you provided a file with no css in it, it could not find the assets file

V1.01 - Better commenting - Return clientscript object for chaining - Refactoring

Total 6 comments

#8772 report it
Zephyr at 2012/06/25 12:42pm
theme

According to Yii documentation (http://www.yiiframework.com/doc/guide/1.1/en/topics.theming)

The theme directory should point out to Webroot/themes (or in other words: Yii::getPathOfAlias('webroot') . DIRECTORY_SEPARATOR . 'themes')

So it's weird there's overlap. Could you try

$basepath = Yii::app()->baseUrl. DIRECTORY_SEPARATOR;
#8770 report it
kmindi at 2012/06/25 11:35am
not fixing it

That does not correct it...

I think the problem is the following:

Yii::app()->theme->baseUrl

gives me /my/web/themes/mytheme/less/ta.less

but

$basepath = Yii::getPathOfAlias('webroot') . DIRECTORY_SEPARATOR;

gives me /srv/http/nginx/html/my/web/

so the paths overlap a bit...

#8769 report it
Zephyr at 2012/06/25 11:02am
nginx

Hi,

Sorry I don't have a nginx server to test this. Could you try something for me?

In LClientscript.php change the

$sourcepath = $basepath . str_replace($basepath, '', $less_input);

to

$sourcepath = $basepath . $less_input;
#8764 report it
kmindi at 2012/06/25 09:23am
LClientscript: Less stylesheet not found

LClientscript: Less stylesheet not found: /srv/http/nginx/html/my/web//my/web/themes/theme/less/ta.less

Do you see the double slash?, Am I doing something wrong?: (Its working if i specify a css file)

<?php Yii::app()->clientScript->registerCssFile(Yii::app()->theme->baseUrl.'/less/ta.less'); ?>
#8754 report it
Zephyr at 2012/06/24 03:19pm
sorry

@kmindi Hi sorry to hear that. I ran some tests, but it works fine here:

Yii::app()->clientScript
                   ->registerCSSFile(Yii::app()->theme->baseUrl.'/css/test.less', 'screen')
                   ->registerCSSFile(Yii::app()->theme->baseUrl.'/css/test.css', 'screen');

Make sure your theme folder exists (/themes/classic)

And your config is correct:

'theme' => 'classic'

My file structure is like this:

/framework
/protected
    /extensions
/themes
     /classic
#8753 report it
kmindi at 2012/06/24 01:32pm
incorrect parsing of paths

I think some urls are not correctly parsed, for example: <?php Yii::app()->clientScript->registerCssFile(Yii::app()->theme->baseUrl.'/css/bootstrap.min.css'); ?>

Leave a comment

Please to leave your comment.

Create extension