If you haven't realized yet, there is a way to use define(name, function)
and define(name, variable)
in Stylus in order to integrate dynamic content into your CSS. Check out this resource for more information.
If you are using Express and run the command
./node_modules/express/bin/express -t jade -c stylus
to set up a basic site, it will handle the templating engines for you--Stylus manages the CSS while Jade (or your preferred view engine) takes care of the rest. The choice of view engine shouldn't impact how data is interpolated in style tags; can you clarify your concerns about this?
If you find yourself embedding style tags directly into HTML, consider moving them to a separate template file for better organization and allowing Stylus to manage them independently.
To manually configure this setup, add something like the following inside app.configure()
:
app.use stylus.middleware({
force: true
src: "#{__dirname}/views"
dest: "#{__dirname}/public/css"
compress: true
})
This thread on Stack Overflow might offer an alternative approach based on your specific requirements.
I hope these suggestions spark some ideas or possibly even provide a complete solution for you :)