Grunt-beginner前端自动化工具_技术笔记

雪豹1993 2020-02-03
安装：
https://yeoman.io/
```
npm install -g yo
```
安装：
https://bower.io/
```
npm install -g bower

bower -v
```
安装：
https://www.gruntjs.net/
```
npm install -g grunt-cli

grunt
```
0赞 · 0采集
慕UI5236663 2018-11-30

1. yeoman安装
npm install -g yo
2. bower安装
npm install -g bower
2. grunt安装
npm install -g grunt-cli

0赞 · 0采集
慕神2234420 2018-10-13

npm install -g yo

0赞 · 0采集
colorfuljun 2018-08-07

在node下安装 Yeoman、Bower、Grunt
1、Yeoman 官网：http://yeoman.io/（现在Web App 的脚手架工具）
作用：
a）在Web项目的立项阶段，使用Yeoman来生成项目的文件和代码结构。
b）Yeoman自动将最佳实践和工具整合进来，大大加速和方便了我们后续的开发
c）提供代码校验、测试、压缩基本工作流程，其余交给生成器自由发挥
2、安装Yeoman
命令安装：npm install -g yo（-g 表示安装在全局）
安装成功如图：
安装完之后执行命令：yo -v（打印yeoman的版本号）
Bower的安装
Bower：web的包管理器
web站点组成：框架、库、公共部分等。而Bower则用来跟踪管理这些
比如：项目A，项目B，A项目使用jquery1.11.1，B项目使用jquery2.1.1以前的做法是去jquery官网下载这两个版本分别放入各自项目中使用。有Bower之后，你需要哪个他就会自动下载哪个到你应用的项目中
安装Bower
安装命令：npm install -g bower
查看版本 bower -v
Grunt 安装
官网： http://gruntjs.com/
Grunt 另一个说法 Build tool
作用：自动化，减少像压缩、编译、单元测试、代码校验这种重复且无业务关联的工作。gurnt有强大的生态插件，插件一直在生长
Grunt 安装
还是标准的npm包安装方式
命令：npm install -g grunt-cli（cli 是command line interface 的缩写）
再执行命令： grunt
结果如图：（看到这个错误消息说明安装成功，为什么会用一个错误消息，是因为grunt-cli会执行当前目录中package.json文件中指定的安装版本来读取我们当前所在目录下的grunt file配置文件，然后按照里面的配置项来对我们的项目执行自动化。为什么要这么设计呢，就是为了可以让多个版本的grunt来并存，以便支持新老项目）

0赞 · 0采集
P妞酱酱 2017-06-03

xxxx

截图
0赞 · 0采集
P妞酱酱 2017-06-03

dddd

截图
0赞 · 0采集
P妞酱酱 2017-06-03

xxx

截图
0赞 · 0采集
P妞酱酱 2017-06-03

ssss

截图
0赞 · 0采集
budflower 2017-06-01

新版本 yo -v 这命令不管用了！！！！请使用 yo --version

0赞 · 0采集
一座桥 2017-05-21

yeoman安装 npm install -g yo bower安装 npm install -g bower grunt安装 npm install -g grunt-cli

0赞 · 1采集
不忘初心2015 2017-05-11

yeoman:现代Web App的脚手架工具。 yeoman：在web项目的立项阶段，使用yeoman来生成项目的文件，代码结构。yeoman自动将最佳实践和工具整合进来，大大加速和方便我们后续的开发。 bower的作用：bower是web的包管理器，一个web工程包括框架、库、公共部分等，而bower用来管理跟踪。 npm install -g bower 安装指令 bower -v 验证方法 grunt：实现自动化。

0赞 · 0采集
侠客岛的含笑 2017-04-27

yeoman:现代Web App的脚手架工具。 yeoman的作用：在web项目的立项阶段，使用yeoman来生成项目的文件，代码结构。yeoman自动将最佳实践和工具整合进来，大大加速和方便我们后续的开发。 Yeoman安装（橡皮泥）：代码校验，测试压缩，其他生成器（模子）自由发挥 bower的作用：bower是web的包管理器，一个web工程包括框架、库、公共部分等，而bower用来管理跟踪这些。比如我们web工程要使用jquery1.11.1版本，之前我们要亲自到jquery公网上将这个版本下载下来，然后使用，现在只需要将这个版本号告诉bower就可以了 grunt的用途：实现自动化，很多机械性的工作，人员做的越少越好，这些都由grunt来完成，比如像“压缩、编译、单元测试、代码校验等这种重复且无业务关联的工作。”，只要是我们想到的工作，基本上grunt相关的生态插件都有，并且grunt的生态仍在持续增长 grunt的安装："npm install -g grunt-cli" grunt (command-line interface) 多grunt可并存安装yeoman到全局：npm install -g yo yo --version 安装yeoman到全局：npm install -g bower bower -v

0赞 · 1采集
aSuncat 2017-03-29

三、grunt （build tool）（外注：构建工具） 1、自动化，减少像像压缩，编译，单元测试，代码校验这种重复且无业务关联的工作。 2、安装：终端输入：npm install -g grunt-cli 3、执行，看是否安装成功终端输入：grunt 如果出现错误消息：fatal error: unable to find local grunt，就是安装成功了。（出现错误提示的原因：grunt cli会执行当前目录中package.json文件中指定安装的grunt版本来读取我们当前所在目录下的grunt file 的配置文件，然后按照其中的配置项来对我们的项目进行自动化。为什么这样设计？为了让多个grunt版本并存来支持新老项目）。

0赞 · 0采集
aSuncat 2017-03-29

二、bower（外注：包管理工具） 1、澳洲有种鸟叫bower，bower雄鸟可以用树枝建凉亭吸引雌鸟的注意。 2、如果A,B两个不同的项目分别需要jquery1.11.1, jquery2.1.1 ，传统做法是自己手动下载这2个版本的jquery，然后放到项目中。而如果告诉bower，需要jquery1.11.1，bower就能自动下载到项目中。 3、安装：终端输入：npm install -g bower 4、查询版本号：终端输入：bower -v

0赞 · 0采集
aSuncat 2017-03-28

一、yeoman(外注：脚手架工具) 1、yeoman提供了代码校验、测试、压缩等基本功能，生成器自由发挥。 2、安装：（1）终端输入：npm install -g yo 注：注册名与商标名不同。注册名是yo，商标名是yoman （2）出现错误：npmconf@2.1.2: this package has been reintegrated into npm and is now out of 解决方法：npm换源：见网页：http://www.jianshu.com/p/0deb70e6f395 1.临时使用 npm --registry https://registry.npm.taobao.org install express 2.持久使用 npm config set registry https://registry.npm.taobao.org // 配置后可通过下面方式来验证是否成功 npm config get registry // 或npm info express （注：其实上述方法试了之后，还是会有提示，但是可以将就着运行到下一步）（3）错误提示：npm WARN deprecated minimatch@2.0.10: Please update to minimatch 3.0.2 or higher to avoid a RegExp DoS issue 解决方法：npm重装终端输入：npm update minimatch 终端输入：npm -v minimatch 终端输入：npm install -g npm@3 3、查询版本号：终端输入：yo --version 4、有关重装yeoman，重装npm的方法。（1） Remove Yeoman $ npm uninstall -g yo （2）Clear NPM Cache $ npm cache clean （3） Upgrade NPM to latest version $ npm install -g npm （4）Install Yeoman $ npm install -g yo 5、中间还跑去安装了git，安装方法：http://www.cnblogs.com/chenlogin/p/5124318.html

0赞 · 0采集
依然_fantasy 2017-03-02

为什么我们需要Build tool?

截图
0赞 · 0采集
CX猿 2017-02-11

不懂的不要着急，慢慢来。git，npm，都是非常简单的东西，觉得安装麻烦是你基础不够扎实，安装都不会更别说以后看源码了，程序员要有耐心！要有耐心！要有耐心！我也是从只会大学教的课程，慢慢地学会那么多潮潮的新知识的。我和慕课在一起，一年多了

0赞 · 0采集
竹子_0 2017-01-16

grunt全局安装 npm install -g grunt-cli

截图
0赞 · 0采集
竹子_0 2017-01-16

Bower全局安装 npm install -g bower

0赞 · 0采集
竹子_0 2017-01-16

YeoMan全局安装 npm install -g yo

0赞 · 0采集
在你坟前蹭个WiFi 2017-01-15

grunt: npm install -g grunt-cli 的安装指令

0赞 · 0采集
qqzhal 2016-12-28

yeoman: npm install -g yo 脚手架、yeoman 自动将最佳实践和工具整合进来,生成器，模具 bower: npm install -g bower 跟踪管理公共部分、库等文件 grunt: npm install -g grunt-cli 压缩等工作自动化

截图
0赞 · 1采集
cs88du 2016-12-02

npm install -g yo

0赞 · 0采集
我愿人长久 2016-11-23

yeoman: npm install -g yo 脚手架、yeoman 自动将最佳实践和工具整合进来,生成器，模具 bower: npm install -g bower 跟踪管理公共部分、库等文件 grunt: npm install -g grunt-cli 压缩等工作自动化

0赞 · 0采集
qweqwe13123123 2016-11-08

grunt的安装代码 npm install -g grunt-cli

截图
0赞 · 0采集
qweqwe13123123 2016-11-08

bower的安装代码 npm install -g bower

截图
0赞 · 0采集
qweqwe13123123 2016-11-08

安装yeoman 的命令

截图
0赞 · 0采集
qweqwe13123123 2016-11-08

build tool 自动化减少压缩、编译、单元测试、代码校验重复的工作验证代码 grunt

截图
0赞 · 0采集
qweqwe13123123 2016-11-08

Bower(包管理器) 跟踪管理 web站点框架库公共部分验证安装代码 bower - v

截图
0赞 · 0采集
qweqwe13123123 2016-11-08

yeoman 在web项目立项阶段生成项目文件，代码结构，自动整合最佳实践工具验证安装 yo — v

截图
0赞 · 0采集

数据加载中...