yeoman可以快速的搭建一个项目的手脚架,初次接触yeoman,在搭建的过程中遇到了很多的问题。

yeoman需要node.js(http://nodejs.org)和git(http://git-scm.com/downloads)作为开发环境,所以需要先安装这两个东西。

yeoman主要由三个东西构成,需要分别安装yo(脚手架工具)、grunt(构建工具)、bower(包管理工具)。

cnmp install -g yo
cnpm install -g grunt-cli
cnmp install -g bower

在这里使用了cnmp,这是百度的一个东西,比npm安装要快很多。

因为要本人写一个AngularJs应用,所以还安装了

cnmp isntall -g generator-angular@0.9.8

然后创建一个项目目录例如StockDog,进该目录运行以下命令创建一个项目

yo angular StockDog

本人第一次没有安装yo,所以报了“yo不是内部或者外部命令”的错误。

查看我们的StockDog目录,如图

如果此时我们输入grunt serve命令启动配置的本地服务器,不会像预期一样运行,而是会报错,提示Unable to find local grunt,这是因为我们没有安装依赖包,查看文件package.json,我们可以看到本项目的依赖包。

所以我们要安装这些所有的包,执行以下命令

cnmp install

此时项目目录中会多出一个名为node_modules的文件夹,该目录包含了cnpm安装的包。

再次输入grunt server命令,还是报错,注意下面的红色报错字体,没有发现bower packages

我们打开bower.json文件,发现了很多项目要依赖的包和模块,有些是在创建项目的时候选择的。

所以我们要安装这些包和模块,执行下面命令

bower install

这时我还遇到了不识别bower命令的问题,于是运行下面命令安装bower

cnpm install bower --save-dev

这时还是有问题

因为bower是通过git下载包的,因为git没有在系统环境中配置路径,此时可以有两种方式解决

  1. 在Git Bash中运行bower install
  2. 配置git的环境变量路径,例如我的在环境变量path中添加G:\Git\bin。
这时项目又多出了一个目录bower_components,该目录包含了bower命令安装的包,最终的项目文件目录如下:


这时再运行grunt server,则会应用会启动,并在默认浏览器中打开一个标签

这时使用yeoman就算成功了。

搭建yeoman自动化构建工具的更多相关文章

  1. gulp自动化构建工具

    gulp    自动化构建工具,实时监控.代码合并.压缩... http://www.gulpjs.com.cn/     中文网 http://gulpjs.com/plugins/     英文网 ...

  2. 前端自动化构建工具-yoman浅谈

    如今随着前端技术的飞速发展,前端项目也变得越来越复杂. 快速的搭建一个集成多种工具和框架的复杂前端项目也越来越成为一种需求. 当然如果你要自己从0开始完全自己diy,绝对可以,只不过需要耗费一些不少的 ...

  3. 浅谈maven自动化构建工具

    转载https://blog.csdn.net/zxm1306192988/article/details/76209062 Maven是什么[what] 1.Maven 是 Apache 软件基金会 ...

  4. 前端自动化构建工具gulp的使用总结

    前端自动化构建工具gulp的使用总结 博主最近偶的空闲,在此对gulp的使用做一个总结,让小伙伴知道如何合理的使用gulp以及gulp的使用技巧. 谈到gulp,有人可能就会想到另外一个构建工具gru ...

  5. 前端开发自动化工作流工具,JavaScript自动化构建工具grunt、gulp、webpack介绍

    前端开发自动化工作流工具,JavaScript自动化构建工具grunt.gulp.webpack介绍 前端自动化,这样的一个名词听起来非常的有吸引力,向往力.当今时代,前端工程师需要维护的代码变得及为 ...

  6. 前端自动化构建工具——gulp

    gulp是基于流的前端自动化构建工具. 一.环境配置 gulp是基于nodejs的,所以没有 nodejs 环境的要先去安装好 然后给系统配上gulp环境 npm install -g gulp 再到 ...

  7. 前端自动化构建工具 Gulp 使用

    一个月没写博客了,今天有时间,就写个gulp的入门使用吧.. 简介:gulp是一个前端自动化构建工具,可以实现代码的检查.压缩.合并……等等,gulp是基于Node.js的自动任务运行器 一.安装No ...

  8. gulp前端自动化构建工具新手入门篇

    很久没有更新博文了. 经过了一次年前吐血的赶项目,终于在年后回血了.趁着有空,新学到了一个前端自动化构建工具-gulp. 现在我们通过这3个问题来学习一下: 1.什么是gulp? 2.为什么要用gul ...

  9. JavaScript自动化构建工具入门----grunt、gulp、webpack

    蛮荒时代的程序员: 做项目的时候,会有大量的js 大量的css   需要合并压缩,大量时间需要用到合并压缩 在前端开发中会出现很多重复性无意义的劳动  自动化时代的程序员: 希望一切都可以自动完成  ...

随机推荐

  1. Mybatis学习(三)XML配置文件之mybatis-config.xml

    1.MyBatis的配置文件结构 1.1 properties 这些是外部化的,可替代的属性,这些属性也可以配置在典型的 Java 属性配置文件中,或者通过 properties 元素的子元素来传递. ...

  2. 开发中mysql和oracle的区别

    首先就不描述mysql与oracle在整个数据库系统上的区别了,仅从程序员开发的角度来说: 1.主键: mysql一般会用到一个自增的属性,例如设置一个id字段,类型设置为auto increment ...

  3. String和StringBuffer分别作为参数传递注意项

    public staticvoid main(){ String s1 = "abc"; StringBuffer sb = new StringBuffer(); sb.appe ...

  4. 走进Node.js 之 HTTP实现分析

    作者:正龙(沪江Web前端开发工程师) 本文为原创文章,转载请注明作者及出处 上文"走进Node.js启动过程"中我们算是成功入门了.既然Node.js的强项是处理网络请求,那我们 ...

  5. Spring框架(一)

    Spring: Spring是一个开源框架,Spring是于2003 年兴起的一个轻量级的Java 开发框架,由 Rod Johnson在其著作 Expert One-On-One J2EE Deve ...

  6. Microsoft Visual Studio调试监视器(MSVSMON.EXE)未能启动

    在启动VS2010项目时,遇到如图所示"Microsoft Visual Studio调试监视器(MSVSMON.EXE)未能启动"的问题. 原因是VS2010安装路径(我的是D: ...

  7. jmeter测试教程

    http://www.cnblogs.com/TankXiao/p/4045439.html

  8. 【Kafka】

    KafkaProducer Kafka消息发布客户端. 线程安全,跨线程共享单个生产者实例通常比拥有多个实例的速度更快. 例子,使用生产者发送包含序列号的字符串作为键/值对的记录: Propertie ...

  9. 51nod 1103 N的倍数 思路:抽屉原理+前缀和

    题目: 这是一道很神奇的题目,做法非常巧妙.巧妙在题目要求n个数字,而且正好要求和为n的倍数. 思路:用sum[i]表示前i个数字的和%n.得到sum[ 1-N ]共N个数字. N个数字对N取模,每个 ...

  10. 实例说明MVC,MVP,MVVM架构

    很早就知道有这三个概念,但是一直都不清楚是怎么回事,在网上搜索,都是泛泛而谈,没有具体例子,新手是看不懂的,直到找到这篇文章,我对这三个架构有了更清楚的了解. 从一个简单的例子去研究这三个架构. 注意 ...