IDT,一个基于Nodejs的,旨在脱离后端环境的前端开发套件,目的就是能让前端开发完全脱离后端的环境,无论后端是什么模板引擎(主流),都能应付自如。IDT主要包括两大部分:Server + Build,这一篇主要介绍Server篇。为了辅助前端开发,一个本地的类似于Apach ...
IDT,一个基于Nodejs的,旨在脱离后端环境的前端开发套件,目的就是能让前端开发完全脱离后端的环境,无论后端是什么模板引擎(主流),都能应付自如。
IDT主要包括两大部分:Server + Build,这一篇主要介绍Server篇。
为了辅助前端开发,一个本地的类似于Apache的服务器是少不了的,但是有个问题,如果项目中的html,是php的smarty模板怎么办?使用纯粹的静态服务器是不行的,因为对前端开发来说,这个html必须由php的smarty模板引擎来解析,前端人员不懂php怎么办,可以让后端人员来协助搭建环境;但是项目是java,而html是velocity模板引擎呢?让后端人员来搭建java环境吧。。。好繁琐呀。而且,我想根据前后端的接口来自己mock数据怎么办?。。这些都是问题,IDT应运而生。
适用于Django Template、PHP Smarty、Java Velocity、Java Freemarker的Integration Develop Tool [ 集成开发工具 ]
其实,IDT中的server使用的是grunt-conect组件,然后通过了middleware的概念,来处理各种类型的数据:
例如:html middleware做的事情,就是把与请求的url相对应的html文件,与自己的mock数据的文件,通过对应的模板引擎渲染,呈现给浏览器:
ajax middleware做的事情也是一样的。
目前,IDT支持了Python Django、PHP Smarty、Velocity、Freemarker的模板引擎的渲染,大大提高了前端开发的效率。
如何安装IDT:传送门
在安装完成以后,就可以开始开发了,在终端输入:idt -V 有正常输出,则安装正常~
在安装的源文件目录中,有一个:example-ws 目录,这里面就是示例目录,在这里可以切换各种模板引擎,进行测试:
.
├── django
│ ├── base.html
│ └── test.html
├── freemarker
│ ├── list.html
│ ├── test.tpl
│ └── view.html
├── idt-config.js
├── mock
│ └── html
│ ├── commonmock
│ │ └── common.js
│ ├── django
│ │ └── test.html.js
│ ├── freemarker
│ │ └── test.tpl.js
│ ├── smarty
│ │ └── test.tpl.js
│ └── velocity
│ └── test.html.js
├── smarty
│ ├── footer.tpl
│ └── test.tpl
└── velocity
├── dep.html
├── header.html
└── test.html
可以把这个目录拷出一份来,并且cd进入此目录,则可以直接执行:
idt ws start
那么这个例子就跑起来了,想结束server,只需要Ctrl+C。
在切换引擎的时候,唯一需要修改的地方就是:
// 模板引擎根目录【只需要修改最后一个参数即可】 templates: path.join( webContent, secondary, 'velocity' ), // 模板引擎切换: smarty / django / velocity / freemarker [ 默认velocity ] /** * velocity模板引擎采用: * https://www.npmjs.com/package/velocity * * django模板引擎采用'A wrapper of Django's template engine'方式(桥接原理) * 详见:https://www.npmjs.com/package/django * 在启用之前请确保python环境已经ready,然后安装django: * # pip install -v Django==1.7 * //or * # easy_install "Django==1.7" * * smarty模板引擎采用: * https://www.npmjs.com/package/nsmarty * * freemarker模板引擎采用:(桥接原理) * 在启用之前,请确保java环境,并且需要安装:http://fmpp.sourceforge.net/ * https://www.npmjs.com/package/freemarker.js#readme */ tplEngine: 'velocity',
海外公司注册、海外银行开户、跨境平台代入驻、VAT、EPR等知识和在线办理:https://www.xlkjsw.com
原标题:旨在脱离后端环境的前端开发套件
关键词:前端
*特别声明:以上内容来自于网络收集,著作权属原作者所有,如有侵权,请联系我们:
admin#shaoqun.com
(#换成@)。