前言:
Yeoman 1.0版本不仅仅是一个工具,它还是一个工作流;一个让web开发和谐甚至变得更好的工具和最佳实践的集合。
致力于提高你在构建web应用时的生产力和舒适度,由三种核心工具构成:yo(脚手架工具),bower(包管理工具),grunt(构建工具)。
Yo 搭建新应用的脚手架,编写你的Grunt配置并且安装你有可能在构建中需要的相关的Grunt任务。
Grunt 被用来构建,预览以及测试你的项目
Bower 被用来进行依赖管理,所以你不再需要手动的下载和管理你的脚本了。
一,安装(前提是已安装过Node.js):
npm install -g yo //它将自动安装Grunt和Bower。
1.这时候可能会出现权限错误
sudo chown -R $USER /usr/local
2.由于网络问题,还可能遇到一个错误(Saving to /tmp/phantomjs/phantomjs-1.9.7-linux-x86_64.tar.bz2),只要网上另找地方下载 phantomjs-1.9.7-linux-x86_64.tar.bz2就可以了(可能需要fanqiang),下载后把压缩包copy到 /tmp/phantomjs/(可以从这里下载http://phantomjs.org/download.htmlr.bz2)
3.安装AngularJS生成器,可以通过npm安装其他的生成器,运行yo可以得到更多详细信息。
npm install -g generator-angular
二,用生成器构建一个工程:
cd mkdir project //新建一个文件夹放你的项目
cd project
yo angular
三,用grunt工具运作工程:
grunt serve //预览工程的运行效果
grunt test //跑单元测试
grunt //构建用于发布的正式版应用
四,工程中引入其他类库:
1.underscore
bower install underscore //使用bower从在线包管理器中拉取underscore代码
grunt
2.grunt-haml
安装:
npm install grunt-haml
在module.exports中添加:
grunt.loadNpmTasks('grunt-haml');
在grunt.initConfig:
haml: {
options: {
language: "ruby"
},
dist: {
files: [{
expand: true,
cwd: '<%= yeoman.app %>',
src: '{,*/}*.haml',
dest: '.tmp',
ext: '.html'
}]
}
},
在watch中:
haml: {
files: ['<%= yeoman.app %>/views/*'],
tasks: ['haml']
},
然而这种情况下,我每次重启服务器后网页加载不上,必须修改以下网页的内容才可以加载上,于是我在grunt.initConfig中给每个haml文件都手动转换为html文件,成功运行
haml: {
index: {
src: "app/views/main.haml",
dest: "app/views/main.html"
},
main: {
src: "app/views/order_details.haml",
dest: "app/views/order_details.html"
}
},
五,其他问题
1.Loading "cdnify.js" tasks...ERROR
>> Error: Unable to create git_template directory: Arguments to path.resolve must be strings
npm install grunt-google-cdn