前端自动化构建工具 - FIS-PLUS - 第二节:逐步使用

前言

fis-plus smarty

技术点

静态资源 id

如有目录 home/static/a.js

资源描述写法如下 home:static/a.js

目录规范

|---site
|     |---common #通用子系统
|     |      |---config #smarty配置文件
|     |      |---page #模板页面文件目录，也包含用于继承的模板页面
|     |            └── layout.tpl
|     |      |---widget #组件的资源目录，包括模板组件,JS组件,CSS组件等
|     |      |     └── menu   #widget模板组件
|     |      |     |    └── menu.tpl
|     |      |     |    └── menu.js
|     |      |     |    └── menu.css
|     |      |     └── ui   #UI组件
|     |      |          └── dialog  #JS组件
|     |      |          |    └──dialog.js
|     |      |          |    └──dialog.css
|     |      |          └── reset #CSS组件
|     |      |               └── reset.css
|     |      |---static #非组件静态资源目录，包括模板页面引用的静态资源和其他静态资源
|     |      |---plugin #模板插件目录(可选，对于特殊需要的产品线，可以独立维护)
|     |      |---fis-conf.js #fis配置文件
|     |---module1 #module1子系统
|     |      |---test
|     |      |---config
|     |      |---page
|     |            └── index.tpl
|     |      |---widget
|     |      |---static
|     |      |     └── index #index.tpl模板对应的静态资源
|     |      |          └── index.js
|     |      |          └── index.css
|     |      |---fis-conf.js #fis配置文件

文件命名规则

• 页面 page

tpl ：path_to_module/page/页面名.tpl
 js ：path_to_module/page/页面名.js
css ：path_to_module/page/页面名.css

• css 组件

#widget目录下的css文件皆为css组件，建议存放在widget/ui目录下
css ：path_to_module/widget/ui/组件名/组件名.css

• js 组件

#widget目录下的js文件皆为js组件，建议存放在widget/ui目录下
js ：path_to_module/widget/ui/组件名/组件名.js

• 模板组件

tpl ：path_to_module/widget/组件名/组件名.tpl
 js ：path_to_module/widget/组件名/组件名.js
css ：path_to_module/widget/组件名/组件名.css

• smarty 配置文件

conf：path_to_module/config/模块名/

• 配置文件 (fis-conf.js)

conf：path_to_module/fis-conf.js

• smarty 插件

插件：path_to_module/plugin/

• 测试数据 (test)

tpl：path_to_module/page/模块名/页面名.tpl
data：path_to_module/test/page/页面名.json(或php)

Smarty 三种语言能力

• {%require%}

参数 name , src

{%require name="common:static/lib/jquery.js"%}
  或
{%require src="http://www.baidu.com/cdn/jquery.js"%} {%*外链*%}

• {%uri%}

参数 name

• widget_inline

内嵌一些widget模板

最新 Smarty 插件

git clone https://github.com/fex-team/fis-plus-smarty-plugin

后进入 plugin 目录 删除.git 目录

参考

http://oak.baidu.com/fis-plus/document.html#%25E9%2585%258D%25E7%25BD%25AE

我的博客