Giter Club home page Giter Club logo

Comments (21)

WnP avatar WnP commented on August 26, 2024 6

Why not just using entr to watch and reload?

from sassc.

fgimian avatar fgimian commented on August 26, 2024 2

Here's another way I documented that you can use using fswatch πŸ˜„

from sassc.

olaf-w avatar olaf-w commented on August 26, 2024 1

I know I'm a little late to the party, but I found a workaround that works just fine for me as long as I just work on one scss / css files pair: Have the sassc input.scss output.css --style=... bash command repeat itself as described in this accepted stackoverflow answer.

In short: Bash (and probably other terminal flavors as well) provides a built-in "watch" function with a pretty straight forward syntax watch -n 30 sassc input.scss output.css --style=... for a 30 seconds repition.

I thought I'd add this here since 1) I haven't been aware of @fgimian 's exquisite solution πŸ₯‡ to date and 2) there's no need to even installing any additional tools.

Edit: Of course there's still the need for a browser tab reload, I solved this with one of dozens of addons available out there.

from sassc.

GitarMan avatar GitarMan commented on August 26, 2024 1

So, I tried some of the above solutions, but this seems to be the simplest one that works for me so I thought I'd share.

I made a simple shell script using a inotifywait with a while do loop.

#!/bin/bash
while inotifywait -r -e close_write sass; do
  sassc --style compact ./sass/style.scss ./style.css
done

You have to install inotify-tools if you haven't yet.

The -r flag means recursive because I'm using a ./sass/ directory with partials in sub-directories. The -e is the event-type flag. You may need to experiment with what exact event types your editor triggers when saving, there are often multiple opens / reads, but the 'close_write' event only triggered once per save for my editor (Atom) so that's the one that I used to trigger the sassc command. You can review the man page here: https://linux.die.net/man/1/inotifywait

My file structure is almost always something like the following (simplified). You can edit the script according to yours.

β”œβ”€β”€ style.css
└── sass
 Β Β  β”œβ”€β”€ style.scss
 Β Β  └── elements
 Β Β   Β Β  β”œβ”€β”€ _elements.scss
 Β Β   Β Β  β”œβ”€β”€ _lists.scss
 Β Β   Β Β  └── _tables.scss

I put the script in my local path of /.local/bin/sasswatch so all I have to do is navigate to the appropriate directory and then type sasswatch

Don't forget to set execute permissions for the script with chmod 755 sasswatch

I'm running Linux Pop!_OS (Ubuntu).

from sassc.

HamptonMakes avatar HamptonMakes commented on August 26, 2024

No, we haven't built this yet. You could make it work with something like guard. But, this is definitely something we should build in.

from sassc.

mgreter avatar mgreter commented on August 26, 2024

I think this will be pretty hard to implement portable! sassc currently is pretty C standard compliant. We only need some additional code on windows to parse the input arguments (getopt). File watching is unfortunately not part of posix and pretty much implemented differentely on every system. This should be somewhat obvious, since it basically involves an event which is triggered by the filesystem. With a fallback solution to checking every monitored file/directory in an interval (bad). I've done it with perl, but it was still a big pain, due to different implementations. Just read the decription for Filesys::Notify::Simple:

"A simple but unified interface to get notifications of changes to a given filesystem path. It utilizes inotify2 on Linux, fsevents on OS X, kqueue on FreeBSD and FindFirstChangeNotification on Windows if they're installed, with a fallback to the full directory scan if they're not available."

Unitil someone knows a C library that abstracts all these portability problems for *nix/mac/win, I don't think this is feasible, so I'm in favor of closing this issue. Seems to be a perfect candidate for other implementations to step in!

from sassc.

pukku avatar pukku commented on August 26, 2024

I think even if you can just watch one file, using some kind of polling technique, it would be useful. (The lack of this is the primary reason I'm going back to using the Ruby gem.)

from sassc.

chriseppstein avatar chriseppstein commented on August 26, 2024

So, this exists:
https://code.google.com/p/simplefilewatcher/

from sassc.

xzyfer avatar xzyfer commented on August 26, 2024

@chriseppstein simplefilewatcher looks promising from a glance.

As an alternative for the moment I've just supercharged the watcher in node-sass. It's now aware of the @import dependency graph and will only compile the ancestors (much like the current Ruby sass watcher).

from sassc.

IbnSaeed avatar IbnSaeed commented on August 26, 2024

Whats the status of this issue ? Will it be implemented or should this be closed ?

from sassc.

xzyfer avatar xzyfer commented on August 26, 2024

Noone is currently working on this. Our priority right now is getting Ruby Sass parity.

If you're using node/io.js node-sass currently has a great watcher. There are also binding for perl, ruby, python, and go.

from sassc.

ysimonson avatar ysimonson commented on August 26, 2024

We made something that builds on sassc to provide directory compilation and watching: http://github.com/dailymuse/gosass

Hope that helps πŸ˜„

from sassc.

xzyfer avatar xzyfer commented on August 26, 2024

There no plans to implement this in the near future. Pull requests are welcome.

from sassc.

TheJaredWilcurt avatar TheJaredWilcurt commented on August 26, 2024

+1 Using Node-Sass + Chokidar for now, but would prefer --watch in SassC.

from sassc.

saper avatar saper commented on August 26, 2024

What could possibly be done portably is an interface to external file watcher that just feeds the file names via the standard input to libsass.

from sassc.

fgimian avatar fgimian commented on August 26, 2024

+1 for me too πŸ˜„

from sassc.

fabio-coolshop avatar fabio-coolshop commented on August 26, 2024

+1

from sassc.

ziodave avatar ziodave commented on August 26, 2024

+1

from sassc.

ziodave avatar ziodave commented on August 26, 2024

Thanks @fgimian that's neat.

I just added -i ".*\.scss$" -e ".*" to the fswatch options to only watch for scss file changes.

from sassc.

fgimian avatar fgimian commented on August 26, 2024

Ah nice @ziodave, glad you found it handy πŸ˜„

from sassc.

staghouse avatar staghouse commented on August 26, 2024

Would love to have this now that sass-ruby is nearing end of life.

from sassc.

Related Issues (20)

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    πŸ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. πŸ“ŠπŸ“ˆπŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❀️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.