generator-hulk

前言

近来前端一直在做效率提升，流程优化，基于现在的大环境 自己弄了个基于yeoman的前端构建环境生成器，在此分享给大家!

什么是yeoman

yeoman 是用于提高前端工程师效率的规范工作流的工具 具体的说明见这里

##使用场景

比如: 你接到一个项目: 在搭建框架的时候 你可能会考虑几点:

1:具体有什么技术(什么类库支持 )

2:生产环境的搭建 (现在基本前端都是基于node) 最起码我们公司是这样的

3:编译环境的搭建 (现在很多前端开发者都用 coffeescript less sass ) 个人觉得这类人比较zb 我比较喜欢 用标准的js css 我就不吐槽了

4:还有测试环境 (现在很少重视这点)

5: 开发后如何打包 (现在都流行用 gulp webpack grunt 等)

相信多数前端同胞们都会考虑到此类问题 这时候你要创建目录 下载的依赖库 引入 js css ... 一系列的操作

最重要的你还要保持团队环境和代码规范的一致性

大家是不是觉得很费时间呢

这个时候 yeoman 就可以解决此类问题 几秒钟时间就搞定了以上所有的问题

但是这个时候你回发现 yeoman提供的一些库 不能满足自己公司的需要 或者是 自己公司的规范

这个时候 需要 自己开发符合自己需求的 或者团队需要的规范

属于我们自己的 generator

下面是安装过程

Installation 安装

First, install Yeoman and generator-hulk using npm (we assume you have pre-installed node.js).

请准备好nodejs环境，安装yeoman,这是最基本的

npm install -g yo

然后 安装

npm install -g generator-hulk

Then generate your new project:

安装完成后 运行 以下命令

yo hulk

generator-hulk 就是干这个事情的

OK，不出意料的话，构建环境已经生成完毕了 生成的目录如下

app文件夹： 不多说

admin文件夹： 不多说

bower_components文件夹：前端包管理器的文件夹，

node_modules文件夹： 环境所依赖的node插件

gitignore：git提交忽略列表，像node_modules这类巨大的文件夹是不会提交的

bower.json：bower的配置文件

package.json：npm包管理配置文件

gulpfile.js 构建工具的核心文件基于gulp,

添加了 yo hulk:marionette 命令 (此命令只是针对我目前负责的项目 来快速的创建文件和公用的代码) 不适合其他的项目

yo hulk:marionette

运行命令后回看到如下:

添加了 yo hulk:backbonerequirejs 命令

运行

yo hulk:backbonerequirejs

这个时候回自动构建 基于 Backbone Require 的 工程 这个时候回创建 temp文件夹 它下面的目录结构 如下

具体的说明在 https://github.com/sohucw/BackboneRequireJS 中

运行

yo hulk:purerouter

类似backbone的路由 但这个是纯路由，没有多余的代码，非常简单

yo hulk:angular 和 yo hulk:react 还有待开发....

结束语 (吐槽)

目前这个版本的 还不是很好用 (个人觉得比较low) 周末有时间的话 我会继续完善
后续会陆续的加入 现在比较使用流行的框架 前后端分离的项目构建流程 基于 1: requirejs+angular+angular-ui-route（+jquery） (什么knockoutjs )

2: requirejs+backbone+jquery+template (这个mvc的味道更浓一些)

3: 针对简单的业务就用最简单的方式 (require router tempalte)

4: react

个人觉得 做前端这一块 还是应该掌握最最基础的东西 框架这种东西用起来感觉挺高逼格的.

比如一个框架功能再好 再强大，团队成员学习成本高 投入多 从老板角度出发 是需要产出的

在比如一个很简单的功能 用jquery 就可以搞定的东西 何必用框架呢

Getting To Know Yeoman

Yeoman has a heart of gold. He's a person with feelings and opinions, but he's very easy to work with. If you think he's too opinionated, he can be easily convinced. Feel free to learn more about him.