yeoman主要包含了三个工具:yo、grunt、bower。我们先看下这三个工具分别是做什么的:
yo:脚手架工具,主要作用是创建项目骨架(跟grunt-init有点像)。
grunt:构建工具,主要用来运行各种任务,比如文件压缩、合并、打包等。
bower:主要用来做前端资源依赖管理,跟npm很像,区别在于:npm管理的是node模块的依赖,bower管理的是前端资源的依赖,如css、javascript文件等。
在安装Yeoman之前,你需要确认以下配置:
Node.js 版本在0.10以上
npm 版本在1.3.7以上
使用:yo –version && bower –version && grunt –version检查是不是所有东西都已经安装好了,Yeoman、Bower、Grunt、Grunt CLI(Grunt的命令行界面)版本号依次被打印。
安装Yeoman生成器
sudo npm install -g generator-angular-require
使用生成器搭建你的应用
1,cd 文件夹
2,yo angular-require
在浏览器中查看你的应用
grunt serve –force
运行命令后本地会启动一个基于Node的http服务。通过浏览器访问http://localhost:9000就可以看到你的应用了。
使用Bower安装包
1,查看已有安装包$ bower list
2,查找要安装安装包是否存在
$ bower search angular-ui-sortable
3,可一次安装多个包
$ bower install –save angular-ui-sortable jquery-ui
–save更新bower.json文件中关于angular-ui-sortable和jquery-ui的依赖,这样你就不用手动去bower.json中更新。
4,index.html引入相应js,app.js更改依赖代码
使用本地存储实现保存
Angular有一个模块叫做’angular-local-storage’可以很简便地帮我们实现本地存储,使用Bower安装:
$ bower install –save angular-local-storage
单元测试
$grunt test
压缩上线
$ grunt –force
如果想要在本地查看这个应用的话,运行$ grunt serve:dist会生成你的项目并且启动本地的服务器。
其他:
添加新的控制器:yo angular-require:controller controllerName,同时在app.js中的路由也会被更新。
添加新的路由:yo angular-require:route
更新相关库:yo angular-require:update
发布前删除不必要文件:yo angular-require:publish