Does anyone know how to install SASS on Laravel 4?

Question

I am trying to run an install of SASS on Laravel 4.

I am running composer and have my composer.json set up like this:

{
    "name": "laravel/laravel",
    "description": "The Laravel Framework.",
    "keywords": ["framework", "laravel"],
    "license": "MIT",
    "require": {
        "laravel/framework": "4.0.*",
        "cartalyst/sentry": "2.0.*",
    },
    "autoload": {
        "classmap": [
            "app/commands",
            "app/controllers",
            "app/models",
            "app/database/migrations",
            "app/database/seeds",
            "app/tests/TestCase.php"
        ]
    },
    "scripts": {
        "post-install-cmd": [
            "php artisan optimize"
        ],
        "post-update-cmd": [
            "php artisan clear-compiled",
            "php artisan optimize"
        ],
        "post-create-project-cmd": [
            "php artisan key:generate"
        ]
    },
    "config": {
        "preferred-install": "dist"
    },
    "minimum-stability": "dev"
}

I wondered if there was a really simple way to do this in composer to add it as a project dependancy.

The reason I want to do this is because its easier to manage and it helps in building in the long run.

If there is another way of doing it and installing grunt to minify the css/js then that would be even better.

Thanks.

Answer 1

Try laravel-sass !

As all of the other projects I found were either dead, horribly broken or simply don't offer any automatic scss compiling (without having to trigger it manually every time) I ended up writing a simple tool that:

• compiles all .scss in your scss folder automatically into same-named .css files into your css folder
• is written in pure PHP !
• uses the excellent scssphp compiler and puts automatism around it
• supports the latest SCSS syntax, currently SCSS 3.2.12
• is installed via Composer with one line of code
• let's you define the scss and the css folder, so you always have accurate, same-name css files of your scss

Installation tutorial on my blog: How to use SASS in Laravel.

Answer 2

Hi laravel developers,

In Laravel 5 and above you can add this in require-dev, note not inside normal require.

Path: "composer.json"

"require-dev": {
    "panique/laravel-sass": "1.0"
}

Add this line into index file.

Path: public/index.php.

SassCompiler::run("resources/sass/", "public/css/");

Note "resources/sass" is the input file path and "public/css" output compiled path. You can also keep this as simple paths like SassCompiler::run("scss/", "css/");

New scss files need to be added under webpacck.

Path: webpack.mix.js

mix.js('resources/js/app.js', 'public/js')
.sass('resources/sass/app.scss', 'public/css')
.sass('resources/sass/student.scss', 'public/css')
.sass('resources/sass/website.scss', 'public/css');

I added few example likes like app,studen and website for samples. Also Sass and Scss are same only few syntax difference to read more : Sass and Scss difference