Reputation: 4022

less/sass with php

I am a front end developer and have recently considered using SASS or LESS for CSS development.

However I do not use Ruby and I don't want to rely on users having JavaScript active. Does anyone have any tips for using SASS or LESS using PHP projects?

Upvotes: 22

Answers (11)

ethanpil

Reputation: 2522

I have http://leafo.net/scssphp/ on a few projects. It works well for me, here is what I do.

Install scssphp into lib/scssphp/

In .htaccess

#Sass Parser: anything /css/FILENAME.css -> FILENAME.scss
RewriteRule ^css/(.*).css?$ style.php/$1.scss [NC,L]

In root folder, I have style.php:

<?php
    require "lib/scssphp/scss.inc.php";
    $scss = new scssc();
    $scss->setFormatter("scss_formatter");
    $server = new scss_server("ui", null, $scss);
    $server->serve();       
?>

In my HTML, I use:

<link rel="stylesheet" href="/css/style.css">

In /ui I have my file of actual SCSS code: /ui/style.scss

And everything just works. SCSSPHP just checks if the file needs to be recompiled and does it transparently, otherwise sends the cached version.

Upvotes: 2

John Doe

Reputation: 971

Why not just use PHP itself to dynamically generate your CSS?? Here are 10 good reasons why:

LESS provides 1 awkward, unfamiliar form of looping - while PHP provides 4 forms of familiar, native looping (do, while, for, foreach).
LESS provides 1 awkward, unfamiliar form of variables - while PHP provides 6 to 12 familiar, native data structures: variables, arrays, associative arrays/hash tables, arrays of arrays/multidimensional arrays, objects, and database record sets. And the Standard PHP Library also provides heaps, stacks, queues, maps, doubly linked lists, and fixed arrays.
LESS does't provide conditionals - while PHP offers 4 familiar, native forms of conditionals: if-then, if-then-else, case/switch, and the ternary operator.
LESS provides 1 awkward, unfamiliar form of including files (import) - while PHP provides 2 familiar, native forms: include and require.
LESS provides various awkward, unfamiliar forms of structuring your CSS - while PHP provides familiar, native, object-oriented forms of structuring your code.
LESS requires learning essentially a new programming language, and following it as it changes over time - while PHP leverages your existing knowledge.
LESS makes your code less readable and less consistent - while preprocessing CSS in PHP keeps your code consistent and makes it more readable.
LESS requires taking an extra "compilation"/preprocessing step and requires maintaining multiple versions of your CSS files - while PHP can either generate the CSS dynamically on-the-fly from a single source (if you're not concerned about performance) or it can generate a final "compiled"/preprocessed version just like a LESS preprocessor (if you're concerned about performance).
LESS requires downloading and installing a third-party preprocessor - while PHP already provides the functionality.
LESS can only be used for CSS - while PHP can be used to dynamically generate CSS, HTML, JavaScript, jQuery, etc.

CSS preprocessors like LESS and SASS may be a savior for desperate front-end developers with no access to back-end tools like PHP. But for a PHP developer, these are counterproductive and less powerful. In my humble opinion, this seems like buzzword mania and add-on mania gone amok. PHP was designed to provide all of the functionality of LESS and a lot more.

Upvotes: 0

user697576

Reputation: 827

There's another less compiler available now: less.php

Upvotes: 1

shea

Reputation: 1166

If you're working with WordPress, you should definitely check out WP LESS. I All you need to do is specify a .less file with wp_register_style or wp_enqueue_style or even add_editor_style, and it compiles your LESS code into CSS code for you. It also caches the resulting CSS so you don't have the overhead of the LESS compiling on every page load.

Upvotes: 2

Andy

Reputation: 31

You can use PhpLessDemandBridge for that: https://github.com/andyhausmann/PhpLessDemandBridge

You can simply use it in your Templates, like:

<link rel="stylesheet" type="text/css" media="all"  href="css/engine/css.php?file=bootstrap.less" />

The Engine can be configured via config file, where you define your path the the less files and cache files.

By defining "css.php?file=bootstrap.less", you point the Engine to the bootstrap file, which import other less files e.g. Twitter Bootstrap or such.

I am using this for Magento, TYPO3 CMS and many more.

In the first line, i am including needed parts of Twitter Bootstrap - after that i am including my own theme and overrides.

Upvotes: 2

leafo

Reputation: 1852

You now have two options written by me:

LESS: http://leafo.net/lessphp/
SCSS: http://leafo.net/scssphp/ (Only has SCSS syntax, not the indentation based SASS syntax)

Both are well documented. I encourage you to try them out and tell me if you have any trouble.

Upvotes: 10

Lulu the hero

Reputation: 269

Download the latest version of lessphp here.

Here is an example on how I tried it:

<?php
require 'lessc.inc.php';

$less = new lessc('test.less');
file_put_contents('test.less.css', $less->parse());

?>
<html>
<head>
    <title>Less CSS</title>
    <link rel="stylesheet" href="test.less.css" type="text/css" />
</head>
<body>
    <h1>This isn't supposed to be black!</h1>
</body>
</html>

And my test.less file:

@color : #33ddff;
.colorful(@textcolor : red){
    color : @textcolor;
}
h1{
    .colorful(@color);
}

It works for me, and it's php!

Upvotes: 26

Jonathan Czitkovics

Reputation: 1614

As part of my job I do use sass with php.

You may try PhamlP as this is what I use. PhamlP is a port of Haml and Sass to PHP.

You may have the sass parser run every page load or you can have it cache the css it generates.

Here is the same question question being asked. if you want to see more options

Upvotes: 2

V-Light

Reputation: 3115

LESS PHP takes a lot of resources...okay lot is relative, but anyway, you should chache the output css. If you're on Mac, use LESSapp. If you're on Windows, use dotLEss (actually it's a library, which could be integrated in several .NET project, but it has a small command-line compiler, wich outputs a valid CSS file)

Upvotes: 2