使用 Xcode 作为 Javascript IDE，可能吗？

Use Xcode as Javascript IDE, possible?

提问by Cyrille

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).

我正在开发一个 Javascript 密集型网络应用程序，目前设计为在 iPhone/iPad 上运行。它也适用于所有 Webkit 浏览器（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.

我有一个自制的 MVC 框架，由许多 JavaScript 文件组成：每个视图一个，每个控制器一个，许多“帮助”类。

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).

我还有一堆 LESS 文件，一个“主”文件包括每个视图的每个 LESS 文件（例如，如果我有一个 UIListView.js，我也有一个 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/projectXfolder, which I browse using my Mac's built-in web server.

目前，我正在使用 MacVim 和 Less.app，并在 iPhone/iPad 模拟器、真正的 iPhone/iPad 上进行测试，有时在 Safari 或 Chrome 上进行测试，当我真的需要使用开发人员工具进行“核心”调试时。我的所有文件都存储在我的~/Sites/projectX文件夹中，我使用 Mac 的内置 Web 服务器浏览该文件夹。

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.

这在开发过程中是可以的，我的 index.htm 引用了很多小文件，但这并不重要，因为我通过 WiFi 在我的 Intranet 上。

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" :

我想要实现的是一种更加“面向项目”的方法。正如当我开发在Xcode在iOS项目，我想从不同的目录中使用的XCode我所有的发展需求，保持我的所有的源文件~/Sites，说~/Desktop/projectX。我想有两个配置（调试和发布）与“构建和运行”一起使用：

• 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 directory (~/Sites/projectX_release) or by sftp to my production server.

• “调试”配置将简单地编译主 .less 文件（包括所有小的 .less 文件），将 JS + CSS + HTM 文件复制到某个目录 (~/Sites/projectX_debug)，以及所有图形资源。然后根据选择的“子配置”，启动 iPhone 模拟器、iPad 模拟器、Safari 或 Chrome，清除其缓存（通过 AppleScript？）并打开 index.htm

• “发布”配置会将所有 JS 文件粘合在一起并缩小它们，编译并缩小 .less 文件，将 index.htm 更改为仅引用粘合的 JS，然后在发送所有文件之前使用 pngout/pngcrush/whatever 优化所有 PNG存档到本地目录 (~/Sites/projectX_release) 或通过 sftp 到我的生产服务器。

I believe I can achieve if not all but most of this using the build phases of XCode 4, maybe using GNU makefiles or some kind of preprocessor, but I'm lost at where to start.

我相信我可以使用 XCode 4 的构建阶段（也许使用 GNU makefile 或某种预处理器）来实现大部分目标，但我不知道从哪里开始。

Does someone already have this kind of setup for using Xcode to do something else than Mac/iOS development, but still using the "classical" concept of build phases/makefiles traditional to most IDEs?

是否有人已经有了这种使用 Xcode 来做其他事情而不是 Mac/iOS 开发的设置，但仍然使用大多数 IDE 传统的构建阶段/生成文件的“经典”概念？

(An acceptable workaround would be to simply create a bash script to handle that — I can already manage it by myself, but I'd really like to use the integrated XCode features, and just pressing Cmd-R to "compile" and run my project in debug mode).

（一个可以接受的解决方法是简单地创建一个 bash 脚本来处理它——我已经可以自己管理它，但我真的很想使用集成的 XCode 功能，只需按 Cmd-R 来“编译”并运行我的项目处于调试模式）。

---

---

采纳答案by brysgo

I will try and step through the things you should do...

我会尝试逐步完成你应该做的事情......

the "debug" config would simply compile the main .less file (which includes all small .less files),

“调试”配置将简单地编译主 .less 文件（包括所有小的 .less 文件），

• I would create a build rule to handle .less files, use a script to compile them.

• 我会创建一个构建规则来处理 .less 文件，使用脚本来编译它们。

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

将 JS + CSS + HTM 文件与所有图形资源一起复制到某个目录 (~/Sites/projectX_debug)。然后根据选择的“子配置”，启动 iPhone 模拟器、iPad 模拟器、Safari 或 Chrome，清除其缓存（通过 AppleScript？）并打开 index.htm

• For this you just need to add your files to the copy phase in the 'Build Phases' section.
• You can set your build directory in your target's 'Build Settings' section (~/Sites/projectX_debug, if you'd like).

• 为此，您只需将文件添加到“构建阶段”部分的复制阶段。
• 您可以在目标的“构建设置”部分（~/Sites/projectX_debug，如果您愿意）中设置构建目录。

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 directory (~/Sites/projectX_release) or by sftp to my production server.

“发布”配置会将所有 JS 文件粘合在一起并缩小它们，编译并缩小 .less 文件，将 index.htm 更改为仅引用粘合的 JS，然后在发送所有文件之前使用 pngout/pngcrush/whatever 优化所有 PNG存档到本地目录 (~/Sites/projectX_release) 或通过 sftp 到我的生产服务器。

• For this part you might want to create a new target and add different rules and settings.

• 对于这部分，您可能想要创建一个新目标并添加不同的规则和设置。

OR

或者

If the above is too complicated:

如果以上内容过于复杂：

1. Write your two bash scripts.
2. Make two targets.
3. Add your bash script as a build phase in each target.

1. 编写您的两个 bash 脚本。
2. 制定两个目标。
3. 在每个目标中添加您的 bash 脚本作为构建阶段。

Hope that helps.

希望有帮助。