UDN-企业互联网技术人气社区

板块导航

浏览  : 2446
回复  : 0

[运维相关] EDP 扩展 edpx-zhixin

[复制链接]
花花蝴蝶的头像 楼主
发表于 2015-7-23 10:01:34 | 显示全部楼层 |阅读模式
本帖最后由 花裤衩 于 2015-9-28 15:13 编辑

## 软件名称        edpx-zhixin


## 软件介绍

edpx-zhixin 是 edp 的一个扩展,提供给百度的FE开发搜索结果页模板的工具
启动edpx-zhixin
通过下面的命令,将根据默认的配置文件edpx-zhixin-config.js,启动edpx-zhixin,edpx-zhixin会在当前目录查找配置文件,如果没找到,会一直向上级目录查找,找到为止。在默认情况下,edpx-zhixin会使用8848作为默认端口,并且将当前目录作为 documentRoot
  1. $ edp zhixin start
  2. 10:45:21 [INFO] monitor -> /Users/sekiyika/Documents/work/src
  3. 10:45:21 all plugins have been loaded.
  4. edp INFO EDP WebServer start, http://192.168.1.106:8848
  5. edp INFO root = [/Users/sekiyika/Documents/work/src/], listen = [8848]
复制代码
指定配置文件
通过--config参数,可以指定edpx-zhixin的配置文件
  1. $ edp zhixin start --config=src/edpx-zhixin-config.js
  2. 10:52:26 [INFO] monitor -> /Users/sekiyika/Documents/work/src
  3. 10:52:26 all plugins have been loaded.
  4. edp INFO EDP WebServer start, http://192.168.1.106:8848
  5. edp INFO root = [/Users/sekiyika/Documents/work/src/], listen = [8848]
复制代码
目录结构
edpx-zhixin要求开发者遵循目录规范,如下:
  1. edpx-zhixin-config.js
  2. src
  3.     page
  4.         ecl_ec_weigou
  5.             config.js
  6.             _page.tpl
  7.             page.tpl
  8.             page.html
  9.             data.json
  10.             ...
复制代码
配置edpx-zhixin
运行edp zhixin start时,需要edpx-zhixin-config.js文件,下面是构成edpx-zhixin-config.js的默认配置
  1. /** * @file edpx-zhixin-config.js *//** * edpx-zhixin的配置 */exports.server = {
  2.     documentRoot: './', // documentRoot以配置文件所在的目录来计算绝对路径,默认为process.cwd()
  3.     port: 8848 // edpx-zhixin的启动端口,默认为8848};/** * 用来配置开发环境依赖的结果页机器地址,可以配置线下机器 * 默认hostname是www.baidu.com,port为80 */exports.proxy = {
  4.     hostname: 'www.baidu.com',
  5.     port: 80};/** * 如果网页中有同名模板,默认干掉同名模板 */exports.removeSameTpl = true;/** * wise相关的host *///exports.proxy = {//    hostname: 'm.baidu.com',//    port: 80//};/** * 指定php可执行的路径 * @type {string} */exports.php = 'php'; // 指定渲染模板使用的php路径,如果path中有,写php即可/** * 指定依赖的base文件,默认会使用edpx-zhixin中自带的c_base.tpl和c_right_base.tpl文件 */exports.base = {
  6.     left: 'c_base.tpl',
  7.     right: 'c_right_base.tpl'};/** * wise相关的base文件 */// exports.base = 'wise';
复制代码
开发模板
从新建模板到release,都提供了相应的命令和工具
edp zhixin init
在行业目录下运行edp zhixin init ecl_fn_demo,如下:
  1. $ edp zhixin init ecl_fn_demo
  2. >> Do you really want to init `ecl_fn_demo` project in `/Users/sekiyika/Documents/work/src/finance` ?(y/n)y
  3. >> There is a exist project, cover it ?(y/n)y
  4. edp INFO >> `/Users/sekiyika/Documents/work/src/finance/page/ecl_fn_demo` create success.
  5. ...
  6. edp INFO >> `/Users/sekiyika/Documents/work/src/finance/page/ecl_fn_demo/config.js` create success.
复制代码
这样就构建好了一个模板开发所需的基本文件
edp zhixin initwise
创建wise相关的模板命令:
  1. edp zhixin initwise [--root|-r] [--platform|-p] [--data|-d]
复制代码
目前支持的wise平台为 iphone,utouch,big,在访问的时候url后缀添加
&tn=iphone、&tn=utouch、&tn=big, 切换到相应的平台
例如:
会调用utouch版本的模板
使用 utpl 支持模板编写
集成utpl的模板功能,在_page.tpl中引入后,自动编译成相关的函数使用, utpl语法同underscore.js的模板语法类似,请参考underscore 获取更多信息
例如:
_page.tpl 内容:
  1. {%*include file="./ajax-list.utpl"*%}
复制代码
注:形如:ajax-list.utpl会被编译成ajaxListRender函数,可以在js中直接调用
ajax-list.utpl 内容:
  1. /*utpl:innerFn=false,trim=false*/
  2. <!--列表项目-->
  3. <ul>
  4.     {%each(tplData.list, function(item, index){%}
  5.         <li><a href="{%=item.link%}">{%-item.title%}</a></li>
  6.     {%});%}
  7. </ul>
  8. <!--记录数-->
  9. {%len = tplData.list.length%}
  10. {%if (len!==0) {%}
  11.     {%=len%}条记录
  12. {%}%}
复制代码
其中
  1. /*utpl:innerFn=false,strip=false*/
复制代码
为编译选项:
  • innerFn=false,表示each,escape等函数不会在模板中内置,需要外部提供
  • strip=false,表示不会自动去除空格、注释

config.js
config.js是每个模板目录下都需要的一个配置文件,主要包含和该模板相关的配置
  1. exports.config = {
  2.     tpl: 'ecl_fn_demo', // 模板名
  3.     querys: [
  4.         'iphone',  // 命中该模板时的query,不指定data会默认使用data.json文件作为数据文件
  5.         {
  6.             query: '游戏',
  7.             data: 'data.json' // 指定渲染所需要使用的数据文件
  8.         }
  9.     ],
  10.     side: 'left', // 模渲染的位置,有left和right的取值
  11.     platform: ['ipad', 'pc'], // 该模板适用于ipad或者pc,根据url中的dsp参数来区分,可以为platform: 'pc'
  12.     //platform: ['iphone', 'utouch', 'big'], //wise相关的platform,根据url中的tn参数来区分,tn=utouch,会切换到简版模板
  13.     ajaxs: [ // 代理请求的数据,常用于代理/ecomui的请求
  14.         {
  15.             url: /a.js/,
  16.             file: 'a_1.js', // file和handler是互斥的关系,handler优先级更高
  17.             handler: function(request) {
  18.                 return fs.readFileSync('data.json')
  19.             }
  20.         }
  21.     ],
  22.     //build: 'release', // 缺省相当于 edp zhixin build,加上相当于 edp zhixin release (下文提及)
  23.     watch: { // 监控源文件的变化并编译产出page.tpl文件
  24.         filters: [
  25.             '_page.tpl',
  26.             '*.less'
  27.         ],
  28.         events: [
  29.             'addedFiles',
  30.             'modifiedFiles'
  31.         ]
  32.     }};
复制代码
edp zhixin start
edpx-zhixin启动时,会查找documentRoot目录下的所有config.js文件,然后根据config.js文件建立query到模板之间的索引
启动之后,可以通过http://127.0.0.1:8848访问
注意:在这里推荐配一个host,搜索结果页大部分静态文件都做了referrer过滤,非百度域可能会遇到403 forbidden,导致文件加载失败
edp zhixin build
build可以让用户手动编译生成page.tpl文件,代码不压缩
edp zhixin release
开发完成模板之后,需要发布压缩后的代码,release比build多做了一步就是编译压缩

## 授权协议        MIT


## 协议解读

MIT许可证之名源自麻省理工学院(Massachusetts Institute of Technology, MIT),又称「X条款」(X License)或「X11条款」(X11 License)
MIT内容与三条款BSD许可证(3-clause BSD license)内容颇为近似,但是赋予软体被授权人更大的权利与更少的限制。
被授权人有权利使用、复制、修改、合并、出版发行、散布、再授权及贩售软体及软体的副本。
被授权人可根据程式的需要修改授权条款为适当的内容。
在软件和软件的所有副本中都必须包含版权声明和许可声明。
此授权条款并非属copyleft的自由软体授权条款,允许在自由/开放源码软体或非自由软体(proprietary software)所使用。
此亦为MIT与BSD(The BSD license, 3-clause BSD license)本质上不同处。
MIT条款可与其他授权条款并存。另外,MIT条款也是自由软体基金会(FSF)所认可的自由软体授权条款,与GPL相容。

## 相关文档

企业级前端应用开发平台:EDP
安装EDP

## 代码下载

您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

关于我们
联系我们
  • 电话:010-86393388
  • 邮件:udn@yonyou.com
  • 地址:北京市海淀区北清路68号
移动客户端下载
关注我们
  • 微信公众号:yonyouudn
  • 扫描右侧二维码关注我们
  • 专注企业互联网的技术社区
版权所有:用友网络科技股份有限公司82041 京ICP备05007539号-11 京公网网备安1101080209224 Powered by Discuz!
快速回复 返回列表 返回顶部