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. 最近使用 .NET Core 遇到的一些坑

    最近.NET Core升级到2.0后开始慢慢捣鼓的多了起来,但遇到了不少坑,所以特来记录下. 第一个坑  条件编译符 我们在编写一些方法的时候通常会为Debug模式增加一些输出日志等以便我们检查,也会 ...

  2. 利用原生js制做数据管理平台,适合初学者学习

    摘要:数据管理平台在当今社会中运用十分广泛,我们在应用过程中,要对数据进行存储,管理,以及删除查询等操作,而我们在实际设计的时候,大牛们大多用到的是JQuery,而小白对jq理解也较困难,为了让大家回 ...

  3. javascript 单元测试初入门

    1.使用mocha工具实现单元测试 ①首先准备node环境 ②安装mocha:npm install mocha 也可以进行全局安装 npm install global mocha ③安装断言库:n ...

  4. 【个人笔记】《知了堂》node.js简介及创建应用

    Node.js是什么? Node.js是建立在谷歌Chrome的JavaScript引擎(V8引擎)的Web应用程序框架.Node.js自带运行时环境可在Javascript脚本的基础上可以解释和执行 ...

  5. SpringAop详解

    近几天学习了一下SpringAop在网上找了一些资料,此链接为原文链接http://www.cnblogs.com/xrq730/p/4919025.html AOP AOP(Aspect Orien ...

  6. 压缩感知中的lp球:p范数最优化为什么总会导致一个稀疏的解的原因

    转自:彬彬有礼. 压缩感知中的lp球:p范数最优化为什么总会导致一个稀疏的解的原因 http://blog.csdn.net/jbb0523/article/details/40268943 题目: ...

  7. Vue.js的从入门到放弃进击录(一)

    感谢我们项目组给机会,让我学了Vue.js,打开新世界大门...哈哈哈,也没有那么夸张,不过学下来确实觉得入门还是蛮容易的.我大概前前后后学了有一个月的样子,一开始只是比较急着可以写东西出来,后来因为 ...

  8. 第4章 同步控制 Synchronization ----事件(Event Objects)

    Win32 中最具弹性的同步机制就属 events 对象了.Event 对象是一种核心对象,它的唯一目的就是成为激发状态或未激发状态.这两种状态全由程序来控制,不会成为 Wait...() 函数的副作 ...

  9. django之快速分页

    本文介绍djanog两种分页,第一是普通分页,第二是使用haystack全文检索的分页. 1.django自带分页功能,这个功能非常好用.基本知识点:Django提供了数据分页的类,这些类被定义在dj ...

  10. JAVA 反射(1)

    getDeclaredField是可以获取一个类的所有字段. getField只能获取类的public 字段.