I'm working on a Javascript-intensive web app designed to run on iPhone/iPad for now. It also works on all Webkit browsers (Safari + Chrome).
I have a home-made MVC framework consisting of many JavaScript files: one for each view, one for each controller, many "helper" classes.
I also have a bunch of LESS files, one "main" including each LESS file for each view (eg. if I have a UIListView.js, I also have a UIListView.less).
Currently I'm working with MacVim and Less.app, and doing tests on both iPhone/iPad simulators, real iPhone/iPads, and sometimes Safari or Chrome when I really need to do "hardcore" debugging with the developer tools. All my files are stores in my ~/Sites/projectX folder, which I browse using my Mac's built-in web server.
This is OK while developing, I have many little files referenced by my index.htm but it doesn't matter as I'm on my intranet over WiFi.
What I'd like to achieve is a more "project-oriented" approach. Just as when I develop an iOS project in Xcode, I'd like to use XCode for all my development needs, keep all my source files in a directory separate from ~/Sites, say ~/Desktop/projectX. I'd like to have two configurations (debug and release) to use with "Build and run" :
the "debug" config would simply compile the main .less file (which includes all small .less files), copy the JS + CSS + HTM file over to some directory (~/Sites/projectX_debug), along with all graphic resources. Then depending on the "sub-configuration" chosen, launch either the iPhone Simulator, the iPad Simulator, Safari, or Chrome, clear its cache (via AppleScript?) and open the index.htm
the "release" config that would glue all JS files together and minify them, compile and minify the .less file, change the index.htm to reference only the glued JS, then optimize all PNGs with pngout/pngcrush/whatever before sending all the archive to a local direct