项目目录分析

1 webapp 

├─ app/
│  ├─ images/
│  │  ├─ glyphicons-halflings.png
│  │  └─ glyphicons-halflings-white.png
│  ├─ scripts/
│  │  ├─ vendor/
│  │  │  └─ bootstrap.js
│  │  ├─ app.js
│  │  ├─ hello.coffee
│  │  └─ main.js
│  ├─ styles/
│  │  └─ main.css
│  ├─ .htaccess
│  ├─ 404.html
│  ├─ favicon.ico
│  ├─ index.html
│  └─ robots.txt
│
├─ node_modules/
│  ├─ so/
│  ├─ many/
│  └─ packages/
│
├─ test/
│  ├─ spec/
│  │  └─ test.js
│  ├─ .bowerrc
│  ├─ bower.json
│  └─ index.html
│
├─ .bowerrc
├─ .editorconfig
├─ .gitattributes
├─ .gitignore
├─ .jshintrc
├─ bower.json
├─ Gruntfile.js
└─ package.json

原始目录中，app 下面存放所有的资源文件，并且都是原始版本也就是未发布的版本

node_modules 存放所有的grunt 模块

test 存放测试用例

最后是与他们同级的配置文件。

在发布阶段，通过grunt build  ，生成与app同级的dist目录，在这个目录下面，存在经过合并、压缩等处理的上线版本文件。

2 fis 目录

|---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
|     |      |---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配置文件

FIS规范定义了两类模块： common模块与 业务模块。

• common模块: 为其他业务模块提供规范、资源复用的通用模块。
• 业务模块: 根据业务、URI等将站点进行划分的子系统站点模块。

common 模块和业务模块module 是同级的。其中common 模块，提供通用的功能，module 提供与具体业务相关的功能

相比于yeoman生成的目录，fis的目录增加了common目录，用来维护通用的功能，这样对于负责的项目，目录层次越多，项目结构也越清晰；fis同时还引入了模块化开发的思路，将一个负责的功能切分成不同的小功能。

个人觉得，对于小项目，采用yeoman webapp 类似的目录，交方便；而对于比较大的项目，fis的层级结构更清晰，同时也有模块化开发的各种好处。

参考：

http://net.tutsplus.com/tutorials/javascript-ajax/building-apps-with-the-yeoman-workflow/

https://github.com/fis-dev/fis-pc/wiki/%E8%A7%A3%E5%86%B3%E6%96%B9%E6%A1%88%E8%A7%84%E8%8C%83