J2EE Velocity 前端集成方案 jello

程序员必上的开发者服务平台 —— DevStore

jello 是针对服务端为 JAVA + Velocity 的前端集成解决方案。jello 为优化前端开发而生，提供前后端开发分离、自动性能优化、模块化开发机制等功能。

前后端分离

基于 velocity 模板引擎实现前后端分离，让前端攻城师更专注于 JS、CSS、VM(velocity 模板文件) 文件编写。 我们提供一种简单的机制，模拟线上环境，让你轻松的预览线上效果。

比如：创建一个 vm velocity 模板文件后，基于我们的工具，你可以直接预览此模板文件的内容， 在相应的目录创建一个同名 json 文件，按与后端开发人员约定好的数据格式， 在此 json 文件中添加测试数据便能自动与模板变量绑定上。

使用此机制可以让前端开发流程与后端开发完全分离，后端开发人员只需关心渲染哪个模板文件和添加相应的模板数据。

自动性能优化

我们基于 velocity 开发了些扩展标签 (directive)，如：html、head、body、script、style、widget... 如果你采用我们提供的标签 (directive) 组织代码，无论按什么顺序组织，我们可以保证所有 css 内容集中在头部输出，所有的 js 集中在底部输出，以达到一个性能优化的效果。

另外结合自动打包配置，可以让多个 js/css 资源合并成一个文件，更大程度的优化性能。

模板继承机制

扩展 velocity 实现类 smarty 的模板继承功能，让模板能够得到更充分的复用。

将多个页面间相同的部分提取到一个 layout.vm 文件里面，每个页面只需填充自己独有的内容。

更多细节查看模板继承。

模块化开发

提供 html、css、js 模块化机制，包括 widget 组件化与 js amd 加载机制，让内容更好的拆分与复用。

简化环境安装

内嵌 j2ee 开发服务器，你无需再折腾 j2ee 环境搭建。直接通过 jello server start 就能开起服务，预览页面。

如何使用

安装

• 安装 nodejs&npm

• 安装 java

• 安装jello & lights

  npm install lights -g npm install jello -g jello -v

快速上手

• 下载 jello-demo

   lights install jello-demo

• 编译预览

   cd jello-demo  jello release  jello server start

• 预览： localhost:8080/example/page/index

jello 命令

三条命令满足所有开发需求

jello --help      Usage: jello <command>      Commands:         release     build and deploy your project         install     install components and demos         server      launch a embeded tomcat server      Options:     -h, --help     output usage information         -v, --version  output the version number         --no-color     disable colored output

• 具体命令使用请参考 fis-plus

配置

参考fis配置

更多资料

• fis

• fis-plus

• gois

• spmx

• phiz