一、Nodejs的安装:

  Grunt和所有grunt插件都是基于nodejs来运行的,如果你的电脑上没有nodejs,就去安装吧。去 https://nodejs.org/ 上,点击页面中那个绿色、大大的“install”按钮即可。

  安装了nodejs之后,可以在你的控制台中输入“node -v”来查看nodejs的版本,也顺便试验nodejs是否安装成功。

  

  注意两点:

  第一,grunt依赖于nodejs的v0.8.0及以上版本;

  第二,奇数版本号的版本被认为是不稳定的开发版,不过从官网上下载下来的应该都是偶数的稳定版。

二、安装npm:

  

  装好NodeJS后,可以在你的终端执行下面的命令安装NPM:

  curl http://npmjs.org/install.sh | sh

  如果这样安装失败,或许你要在上面的命令之前加上sudo,并按提示输入你的用户密码。详细的安装请点击这里查阅。

  如果需要检验安装NodeJS或NPM是否要成功,可以通过下面的命令来检验:

  

  这样你的NodeJS和NPM表示安装成功。

 三、安装Grunt: 

  为了方便使用Grunt,你应该在全局范围内安装Grunt的命令行接口(CLI)。要做到这一点,需要在命令行中执行:

  $ npm install -g grunt-cli

  这条命令将会把grunt命令植入到你的系统路径中,这样就允许你从任意目录中运行Grunt(定位到任意目录运行grunt命令)。

  注:如果不能安装

  参考https://cnodejs.org/topic/4f9904f9407edba21468f31e

  设置镜像 再执行$ npm install -g grunt-cli 安装

  镜像使用方法(三种办法任意一种都能解决问题,建议使用第三种,将配置写死,下次用的时候配置还在):

  1.通过config命令

  npm config set registry https://registry.npm.taobao.org
  npm info underscore (如果上面配置正确这个命令会有字符串response)

  2.命令行指定

  npm --registry https://registry.npm.taobao.org info underscore 

  3.编辑 ~/.npmrc 加入下面内容

  registry = https://registry.npm.taobao.org

  搜索镜像: https://npm.taobao.org

  建立或使用镜像,参考: https://github.com/cnpm/cnpmjs.org

详细学习可见:

  http://blog.csdn.net/wangfupeng1988/article/details/46418203

  http://www.w3cplus.com/tools/grunt-tutorial-installing-grunt.html

web前端开发中Nodejs、Grunt、npm等的介绍、使用的更多相关文章

  1. WEB前端开发中的图片压缩

    web前端开发中,图片的重要性不言而喻,而由于一些图片的大小加上现在国内的网速不给力等种种原因,我们非常有必要对网站使用的图片进行压缩,压缩图片必然会带来图片质量的损失,我们要尽可能的在质量降低很小的 ...

  2. Web前端开发中的MCRV模式(转)

    作者: izujian  来源: baiduux 摘要:针对前端开发中基于ajax的复杂页面开发所面临的代码规模大,难以组织和维护,代码复用性.扩展性和适应性差等问题,本文尝试以MVC思想为 基础,结 ...

  3. Web前端开发中的小错误

    Web前端开发中的小错误 错误1:表单的label标签跟表单字段没有关联 利用“for”属性允许用户单击label也可以选中表单中的内容.这可以扩大复选框和单选框的点击区域,非常实用. 错误2:log ...

  4. 创建 Web 前端开发环境(node和npm以及git)

    Web 前端开发涉及多种工具,这里将常用工具的安装和配置进行说明,提供了详细的说明,为后继的开发创建一个坚实的基础. 本文介绍的工具有:NodeJS, NPM, Bower, Git 和 Grunt. ...

  5. 创建 Web 前端开发环境(node和npm)

    Web 前端开发涉及多种工具,这里将常用工具的安装和配置进行说明,提供了详细的说明,为后继的开发创建一个坚实的基础. 本文介绍的工具有:NodeJS, NPM, Bower, Git 和 Grunt. ...

  6. web前端开发中常用的尺寸和位置

    我们在日常web前端开发过程中,会经常用到各种尺寸和位置.通常是js做动画的时候.轮播图,滚屏动画,粒子,碰撞检测,拖拽,滚动加载等等.这里我将常用的尺寸和位置的获取进行总结,不包括canvas,SV ...

  7. px em rem在WEB前端开发中的区别

    我们都知道基于像素的字体大小所用的单位是px,但是随着响应式设计的不断火热,基于相对字体大小的单位em变开始流行起来.当然,rem也在Web前端开发人员讨论如何更好设置字体大小的讨论话题之列.是不是需 ...

  8. web前端开发中的浏览器兼容性总结

    1.居中问题 div里的内容,IE默认为居中,而FF默认为左对齐,可以尝试增加代码margin: 0 auto; 2.高度问题 两上下排列或嵌套的div,上面的div设置高度(height),如果di ...

  9. WEB前端开发中的SEO注意点

    近几年来,SEO在国内得到了蓬勃的发展,其中很多的SEO技术越来越体现在web前端的一些细节上.要做好SEO,WEB前端这一块也要做必不可少的优化. 这就要求我们WEB前端工程师在开发页面的时候,要写 ...

随机推荐

  1. WPF FindName()查找命名注册的元素

    一.查找xaml中命名注册的元素 <Button x:Name="btn1" Content="显示内容" HorizontalAlignment=&qu ...

  2. oracle 报Ora-01008错误:oracle 并非所有变量都已绑定的原因.TO_number();动态执行select..into..语句时

    1.sql_temp := 'UPDATE B38_back SET '||code||'=TO_NUMBER(nvl('||:NEW.BACAI||',0))+'||OnMonth || ' WHE ...

  3. Linux系统swap已分区但无法挂载与cryptswap1问题

    linux下察看swap分区大小的命令 top 或者fdisk -l 或者free -m SWAP分区一般大小为物理内存的2倍,但最大不超过2G; 增加SWAP空间的方法有两个:增加另外一个SWAP分 ...

  4. JSONModel的基本使用

    JSONModel 是一个库,它能智能并且快速的创建出数据 model,你可以在你的 iOS 项目或者 OSX 项目上使用它. 使用前准备 添加 JSONModel 到你的工程中 1.需要的环境: A ...

  5. 给表格设置border还可以这样玩

    <table width="100%" border="0" cellpadding="0" cellspacing="1& ...

  6. SGU 195. New Year Bonus Grant

    时间限制:0.75s 空间限制:4M 题意: 在一颗树(最多500000个节点)中,可以对节点染色,但是一个节点染了色后,它的父节点和兄弟节点都不能再染了,求最大的染色节点数,并输出所有染色节点. S ...

  7. 【BZOJ2741】【块状链表+可持久化trie】FOTILE模拟赛L

    Description FOTILE得到了一个长为N的序列A,为了拯救地球,他希望知道某些区间内的最大的连续XOR和. 即对于一个询问,你需要求出max(Ai xor Ai+1 xor Ai+2 .. ...

  8. 中级Perl 第三章课后习题

    3. 10. 1. 练习1 [25 分钟] 读当前目录的文件列表并转换成全路径.不能用shell 命令或外部程序读当前目 录.Perl 的File::Spec 和Cwd 两个模块对这个程序有帮助.每个 ...

  9. (二)跟我一起玩Linux网络服务:BIND的自动部署(附上完整的代码)

    2015-03-24   如果看了我之前写的文章 DNS服务——BIND(/etc/named.conf./var/named)设置实现和解释,再来看这篇文章,你会发现部署BIND是件很简单的事情 如 ...

  10. Bootstrap_网格系统

    首先添加CSS样式: [class *= col-]{ background-color: #eee; border: 1px solid #ccc; } [class *= col-] [class ...