asset-rack icon indicating copy to clipboard operation
asset-rack copied to clipboard

Watch for Stylus / Jade templates doesn't work?

Open max-degterev opened this issue 11 years ago • 6 comments

Would be very nice to have it working! And I mean client side precompiled into a variable frontend templates ofc. Having watch only for javascript is just teasing

This is my setup:

assets = new rack.AssetRack([
  new rack.StylusAsset(
    watch: true
    url: '/assets/app.css'
    filename: __dirname + '/css/app.styl'
    paths: [__dirname + '/css']
    compress: !config.debug
  )

  new rack.SnocketsAsset(
    url: '/assets/libs.js'
    filename: __dirname + '/app/client/libs.js'
    compress: !config.debug
    watch: config.debug
  )

  new rack.SnocketsAsset(
    url: '/assets/app.js'
    filename: __dirname + '/app/client/app.coffee'
    compress: !config.debug
    watch: config.debug
  )

  new rack.JadeAsset(
    url: '/assets/views.js'
    dirname: __dirname + '/views/client'
    separator: '_'
    clientVariable: 'app.templates'
    compress: !config.debug
  )
])

Stylus has loads of imports in app.styl, looks like you don't check for imports changes or something.

max-degterev avatar Jul 25 '13 10:07 max-degterev

For me, watch works with Stylus/Jade but not with Browserify or Static. See #79 . Clearly, the watch code needs to be improved. It's only 8 lines of code here: https://github.com/techpines/asset-rack/blob/master/lib/asset.coffee#L108

But, I'm not clear why it's not working.

One possibility would be to import the 3 different watching methods used by nodemon, which is quite reliable for me (just slower to restart): https://github.com/remy/nodemon#help-my-changes-arent-being-detected

dankohn avatar Jul 25 '13 13:07 dankohn

I was using nodemon and I don't like to restart server on every filechange as it takes a lot of time. And yes, even for JS/snockets it doesnt look up the dependencies so atm its a totally broken feature

max-degterev avatar Jul 25 '13 14:07 max-degterev

The watch stuff could definitely be improved substantially.

I tried to just make a generic implementation that might work across assets. For some of these compilers like less and stylus, I'm not totally sure how you would figure out the dependency resolution problem unless you hacked into the internals of the library.

One idea might be to put aside trying to understand how each compiler does dependency and file resolution, and allow a user to specify which files to watch, in a more or less flexible format:

toWatch: [
    __dirname + '/styles/*.less'
]

I don't know, but I definitely don't like restarting the server, etc.

techpines avatar Jul 25 '13 15:07 techpines

Yes, don't both trying to understand the dependency graph. Nodemon has a perfectly good model, which is that it supports watching specific extensions in specific directories. The big question is why fs.watch doesn't work.

dankohn avatar Jul 25 '13 17:07 dankohn

In my opinion what should be done is having multiple ways to determine what to watch.

  • If the user provides a list of things to watch, watch those (and only those)
  • If the compiler has a dependency graph available use it
  • and if not use a generic method like we have now (I'm assuming, been a while since I looked at the code.)

fs.watch is marked unstable My guess is to use whatever code nodemon uses with changes if necessary as mentioned above. File watching is difficult, so why reinvent the wheel eh?

PS: Instead of yet another global option perhaps it would be wiser to use watch to take a list instead of toWatch?

new SomeAsset
    url: '/asset/mcAwesome'
    watch: [
        'list/of'
        'files'
        'to/watch'
    ]

noc7c9 avatar Jul 26 '13 11:07 noc7c9

Maybe https://github.com/shama/gaze ?

max-degterev avatar Jul 28 '13 19:07 max-degterev