管理web组件的依赖关系;JS、CSS/SASS和模板文件

我正在寻找新web组件的结构布局，目前还不确定我是否找到了一个工具，可以实现我们理想中想要的所有功能，或者非常接近，但这似乎是现在很常见的事情。

我们有一个在服务器端运行Java的web应用程序，而在客户端，我们大量使用JavaScript和SASS等。我们希望重新构建一些代码库，并对动态页面内容的某些方面进行组件化。

例如，我们希望有一个标准的表组件，可以完全独立于完整的web应用程序开发。我看到表组件有以下3个核心文件：

• table.js
• table.scss（我们的SASS文件，可编译为CSS文件）
• table.tmpl（我们的模板文件，它最终被编译成JS函数，例如使用Handlebars作为模板引擎）

然后帮助开发：

• table-test.html（包含一些伪数据的测试页面）
• table-qunit.js（qunit测试）

所有这些文件都有望编译成以下文件：

• components.js-table.js和table.tmpl经过编译和缩小，然后与所有其他组件一起拉入一些更大的js文件
• components.css-table.scss经过编译和压缩，并与所有其他组件css合并

我看过的工具：

• requireJS-似乎非常专注于JS依赖性管理，对资源文件有一些想法，但找不到任何关于它的使用和像SASS这样的CSS预处理器的信息。然而，我确实非常喜欢AMD JS依赖性管理的想法
• Grunt-一个节点包，可以实现我们想要的功能
• Sprockets-类似于我们想要的东西的Ruby实现
• Javascript Maven插件-在语言/库方面最接近（我们已经使用了Java和Maven），但似乎只考虑Javascript依赖性管理，而不考虑CSS，或者至少考虑SASS资源文件

有人有比以上更好的建议吗？有什么更接近我们想要的吗？理想情况下，不需要Node.js或Ruby的东西会更可取。。。