咖啡脚本、玉石、手写笔 -> js、css 资源管理器?节点.js
我使用 CoffeeScript、Jade 和 Stylus 进行工作。
我的应用程序提供两个不同的“一页应用程序”。对于这些应用程序,我在初始负载中提供所有资产。
我想将所有的 CoffeeScript 文件和 Jade 模板分组、编译并连接到单个 JS 资源中,并将 Stylus 文件连接到每个“一页应用程序”的单个 CSS 资源中。
然后我可以只保留我的 /public/js
和 /public/css
,它们将始终拥有两个不同应用程序的当前 js 和 css 资源文件。
有人以前设置过这样的工作流程吗?我有什么想法可以做到这一点吗?
通过研究,我发现了这里写的过程,但他们没有说明他们是如何做到的。
http://blog.fogcreek.com/the-trello-tech-stack/< /a>
I work in coffeescript, jade and stylus.
My application serves two different "one page apps". For these apps I serve all asset in the initial payload.
I want to group, compile, and concatenate all coffeescript files and jade templeates into a single js asset and stylus files into a single css asset for each "one page app".
Then I can just leave my /public/js
and /public/css
alone and they will always have the current js and css asset files for the two different apps.
Has anyone setup a workflow like this before? Any ideas how I could do this?
Through research I found the process written about here but they don't say how they did it.
http://blog.fogcreek.com/the-trello-tech-stack/
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(5)
您可以使用 JS 非常简单地使用 Express + Stitch / StitchUp
示例配置:
https://gist.github.com/1094412
另一种选择是 Interleave:
http://www.distractable.net/coding/javascript-builds-using-interleave
并且选项stylus 中间件应该可以帮助你解决 CSS 问题:
http://learnboost.github.com/stylus/docs/middleware.html
这里还有无数的选项:
http://toolbox.no.de/search?q=asset
You can do this with JS pretty simply with Express + Stitch / StitchUp
Sample config:
https://gist.github.com/1094412
An alternative is also Interleave:
http://www.distractable.net/coding/javascript-builds-using-interleave
And the options for stylus middleware should sort you out for your CSS:
http://learnboost.github.com/stylus/docs/middleware.html
There's also a myriad of options over here:
http://toolbox.no.de/search?q=asset
我为此编写了一个节点应用程序。这非常简单,但对我有用。代码非常简单(72 行),您可以随意调整。每当您保存咖啡、手写笔或玉文件时,它都会转换为 js、css 或 html。它不负责文件删除或任何其他花哨的事情。它并不完美,但至少我确切地知道它是如何工作的,这使得调试变得容易。
https://github.com/Gijsjan/Template-Engine-Watcher
I wrote a node app for this. It is V E R Y simple, but it works for me. The code is so simple (72 lines) you can adjust it anyway you like. Whenever you save a coffee, stylus or jade file it converts to js, css or html. It doesn't take care of file removals or any other fancy stuff. It's not perfect, but at least I know exactly how it works, which makes debugging easy.
https://github.com/Gijsjan/Template-Engine-Watcher
我写了一个开源项目(麻省理工学院许可证)来解决这个问题:
Giles - https://github.com/255BITS/ giles
Giles 为您构建静态资产(Jade、Stylus、CoffeeScript)。它可以独立运行、作为 Web 服务器或作为连接模块运行。您可以轻松地向 Giles 添加对其他语言的支持(请参阅 github 页面)
I wrote an open source project(MIT license) to address this problem:
Giles - https://github.com/255BITS/giles
Giles builds your static assets for you(Jade, Stylus, CoffeeScript). It can be run standalone, as a web server, or as a connect module. You can add support for other languages to Giles easily(see the github page)
您可以使用 connect-assets 管道将已编译的 Jade 资产拉入您的 JavaScript,方法是使它们依赖于使用它们的 CoffeeScript 文件。
我有一篇博客文章,其中包含详细信息 -> 服务器端使用 connect-assets 编译 Jade 模板< /a>.
You can use the connect-assets pipeline to pull compiled Jade assets into your JavaScript by making them dependencies of the CoffeeScript files that use them.
I have a blog post with the details -> Server side compiling of Jade templates with connect-assets.
我建议使用 Grunt,通过 Grunt,您可以设置各种工作流程和任务。我个人使用 mean.io 作为大多数项目的样板。他们有一个非常好的 Grunt 文件,其中包含使用 将 css 和 js 连接和缩小到单个文件所需的大部分任务资产管理器。 Mean.io 不使用 jade 或手写笔,但您可以轻松添加这些 Grunt 任务。
I recommend using Grunt, with Grunt you can setup all kinds of workflows and tasks. I personally use mean.io as my boilerplate for most of my projects. They have a really nice Grunt file with most the tasks you need to concat and minify css and js into a single file using assetmanager. Mean.io doesn't use jade or stylus but you could easily add those Grunt tasks.