Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

integrating square in dev workflow #19

Open
twojcik opened this issue Jun 2, 2012 · 4 comments
Open

integrating square in dev workflow #19

twojcik opened this issue Jun 2, 2012 · 4 comments
Labels

Comments

@twojcik
Copy link

twojcik commented Jun 2, 2012

Hi,
I researched many of asset builders in node and every one of them sucks. Square seems to be the closest I'm looking for, but I'd like to know how do you handle following situations:

  1. using square in dev mode - watching for file changes and automatic recompilation, but without concatenatic/minifying files as want to have better debugging capabilities

  2. producing some sort of manifest.json which would contain all filenames of compiled files , so could easily use it in express to reference those files.

  3. do I have to watch for css and js changes files separately via square --watch ?

  4. how to pass aditional options to stylus preprocessor config ?

  5. should I use stylus @import or square comments with import directives?
    Cheers,
    Tadek

@3rd-Eden
Copy link
Member

3rd-Eden commented Jun 3, 2012

1 you can just do square --bundle . --watch and it will compile both the min and the dev with the exact same contents.
2 i'm currently working on that in the development branch, I was thinking of adding either a new command line flag so you can get a bundle->compiled filename mapping in a seperate file, or automatically add a new key to your square.json file so you can read that in instead of having another file for this.

3 you can override the extensions that are watched in the configuration:

{
  "configuration": {
    "dist": "/www/site/output/pewpew.{ext}",
    "watch": [] // empty array to watch all the files, or an array with file extensions to watch
    }
  },
  "bundle": {
   .. your files ..
  }
}

4 There is no such option, what you would want to configure there?
5 I would just use the provided @import support from the pre-processors if they support it and use the // [square] directives for files that do not support this behavior.

@twojcik
Copy link
Author

twojcik commented Jun 3, 2012

Thanks for answers.

  1. Problem with having dist as string (meaning dev and min will compile to the same file) if that I really want to have separate dev and production build and in production build want to use md5 as part of file name what when using currently in watch mode produces lots of files. Created quick patch locally which creates min build only when node env is 'production' to overcome that issue. Additionally noticed that dev build isn't processed by plugins, is it by design?
  2. Great. In perfect world I'd like to have in dev mode only compilation made no concatenation and manifest produced, but square currently doesn't work that way, but can live with that. Could you point me where is the best place to put such logic in square? I'd like to try to do this myself.
  3. Does this work in master branch? I have coffee and stylus files in on bundle and when watching it watches only for coffee files, or I'm missing something?
  4. For example stylus url functionality (http://learnboost.github.com/stylus/docs/functions.url.html) , currently no way to register it except of modifying source.
  5. Thanks !

Thanks for answers once again!

Cheers,
Tadek

@3rd-Eden
Copy link
Member

3rd-Eden commented Jun 4, 2012

  1. This is already possible, instead of using a string in the diet configuration field you can supply it with an object (see the snippet I posted above). This way you can have different output directories and names depending on the distribution.
  2. Fixing that would be to hard, you probably need to check if layers array has a length before we call the https://github.com/observing/square/blob/master/lib/square.js#L570 iterate function
  3. Yes this already works in master. And I think the problem for you is square is currently configured to only build one extension at a time. Stylus compiles to CSS and Coffee to coffee script so for the time being you probably need to start 2 watching instances, one without --extension css and one with it.
  4. Hmz, I haven't really thought about that and how I should handle that.. I could probably add another field to the square.json files with the name pre-processors where you can specify options per preprocessor.. This definitely something that needs to be fixed. I'll add it to the todo list for the next release.

@twojcik
Copy link
Author

twojcik commented Jun 6, 2012

Thanks.

  1. But in that case both prod and dev files will be created what means lot of files in dev/watch mode.
  2. Thanks, I've forked square and add some quick hacks to make it usable for my purposes
  3. Overcomed it in very hacky way in my fork
  4. Thanks !

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Projects
None yet
Development

No branches or pull requests

2 participants