Be part of JetBrains PHPverse 2026 on June 9 – a free online event bringing PHP devs worldwide together.

BlueScreenJunky's avatar

How to compile separate sass file to separate css files and only compile changed files ?

Hi, We're having trouble with elixir and hoping someone can help. We're building an app that is using several distinct css stylesheets. We're using the same app to serve thousands of different sites and each one can choose between 3 differents looks (for now, it might be 10 or 20 in the future) that will slightly change the view and use a different stylesheet. So we have one sass file with various includes for each of these three looks, and each one should be compiled to a different CSS file (and not merge them into an app.css file)

Here's what I tried :

mix.sass(['modern.scss', 'classic.scss', 'contemporary.scss']);

Which compiles to a unique app.css file (or a different filename if I pass it as a second parameter), so not what I want.

So I tried this :

    mix.sass('modern.scss', './public/css/modern.css')
        .sass('classic.scss', './public/css/classique.css')
        .sass('contemporary.scss', './public/css/contemporary.css')

Which actually gives me the expected result, but re-compiles and regenerate all three files each time which is a huge waste of time on our slowish machines, and it will only get worse when we have more files. Also, in this github issue Jeffrey says that calling sass() multiple time is not recommended.

So my questions are :

  1. What is the recommended way to compile several different files ?
  2. How do I prevent Elixir from recompiling every single file when I change just one ?

For reference, I found other people with the same problem but no satisfying answer:

http://stackoverflow.com/questions/34604318/make-laravel-elixir-watch-only-changed-file

https://laracasts.com/discuss/channels/elixir/can-elixir-mix-only-the-changed-sass-files

0 likes
1 reply
jekinney's avatar

I comment out the lines I don't need when I'm working on a specific file.

Also gulp watch will watch for changes and only compile what it needs.

Please or to participate in this conversation.