1、grunt作用

       实现压缩、编译、单元测试等重复性工作

2、需要安装的软件

        

第一步:从官网获取nodejs的软件包,直接双击进行安装(windows下)

第二步:打开cmd命令行,执行命令‘node  -v’,能输出版本号,说明node已经正常安装

第三步:在cmd命令行,输入上图所述的安装命令,分别安装grunt-cli  和 grunt

3、grunt使用

第一步:在项目所在目录,创建package.json 和 Gruntfile 两个文件

package.json的内容,可以自定义为:

     {

     "name": "project-name",
    "version": "0.1.0",
    "devDependencies":{
      "grunt": "~0.4.5",
      "grunt-contrib-jshint": "~0.10.0",
      "grunt-contrib-nodeunit": "~0.4.1",
      "grunt-contrib-uglify": "~0.5.0"
    }
  }

  Gruntfile 内容可自定义为如下,根据情况进行修改

 module.exports = function(grunt) {

   // Project configuration.
grunt.initConfig({
pkg: grunt.file.readJSON('package.json'),
uglify: {
options: {
banner: '/*! <%= pkg.name %> <%= grunt.template.today("yyyy-mm-dd") %> */\n'
},
build: {
src: 'src/<%= pkg.name %>.js',
dest: 'build/<%= pkg.name %>.min.js'
}
}
}); // Load the plugin that provides the "uglify" task.
grunt.loadNpmTasks('grunt-contrib-uglify'); // Default task(s).
grunt.registerTask('default', ['uglify']); };

4、配置文件讲解:

关于package.json:

关于Gruntfile:

使用grunt实现web自动化的更多相关文章

  1. web自动化开发环境配置详解

    1.安装 nodejs Grunt和所有grunt插件都是基于nodejs来运行的, https://nodejs.org/ 安装完成之后在终端 node -v 查看安装版本 2.安装 grunt-C ...

  2. web自动化工具-开篇

    web自动化工具-开篇 最近几年,前端技术风一样的速度迭代更新,各种框架工具雨后春笋般涌现,作为一个平凡的开发者,也只能在洪流中沉沉浮浮,微不足道,以前前端叫做切图仔.美工,如今改了称号叫前端工程师, ...

  3. web自动化工具-liveStyle

    web自动化工具-liveStyle LiveStyle. The first bi-directional real-time edit tool for CSS, LESS and SCSS主要用 ...

  4. web自动化工具-livereload

    web自动化工具-livereload livereload是一个很神奇的工具,主要解放了F5键,监听文件变动,整个页面自动刷新.可搭载gulp等构建工具使用.和liveStyle 针对样式文件相比, ...

  5. web自动化工具-Browsersync

    web自动化工具-Browsersync browser-sync才是神器中的神器,和livereload一样支持监听所有文件.可是和livereload简单粗暴的F5刷新相比,browsersync ...

  6. Selenium Web 自动化 - 项目实战(三)

    Selenium Web 自动化 - 项目实战(三) 2016-08-10 目录 1 关键字驱动概述2 框架更改总览3 框架更改详解  3.1 解析新增页面目录  3.2 解析新增测试用例目录  3. ...

  7. Web自动化框架LazyUI使用手册(2)--先跑起来再说(第一个测试用例-百度搜索)

    作者:cryanimal QQ:164166060 上篇文章中,简要介绍了LazyUI框架,本文便来演示,如何从无到有快速搭建基于lazyUI的工程,并成功运行第一个测试用例. 本文以百度搜索为例,选 ...

  8. Web自动化框架LazyUI使用手册(1)--框架简介

    作者:cryanimal QQ:164166060 web端自动化简介 web端自动化,即通过自动化的方式,对Web页面施行一系列的仿鼠标键盘操作,以达到对Web页面的功能进行自动化测试的目的. 其一 ...

  9. Web自动化框架之五一套完整demo的点点滴滴(excel功能案例参数化+业务功能分层设计+mysql数据存储封装+截图+日志+测试报告+对接缺陷管理系统+自动编译部署环境+自动验证false、error案例)

    标题很大,想说的很多,不知道从那开始~~直接步入正题吧 个人也是由于公司的人员的现状和项目的特殊情况,今年年中后开始折腾web自动化这块:整这个原因很简单,就是想能让自己偷点懒.也让减轻一点同事的苦力 ...

随机推荐

  1. php分页原理教程及简单实例

    <?php //连接数据库 $con = mysql_connect("localhost","root",""); mysql_se ...

  2. 前端MVVM框架:Knockout.JS(一)

    前言 在我们平时开发 Web 应用程序的时候,如果项目不算特别大的话,一般都是拿 jQuery 再配合一些前端 UI 框架就在项目上面应用了.如果页面逻辑稍微复杂的话,那个在写前端 JavaScrip ...

  3. js原生设计模式——3简单工厂模式\js面向对象编程实例

    <!DOCTYPE html><html lang="en"><head>    <meta charset="UTF-8&qu ...

  4. spring mvc 文件下载

    在controller中进行代码编写: @RequestMapping("/download") public ResponseEntity<byte[]> downl ...

  5. Windows上的音频采集技术

    在制作发布端的时候,需要采集到声卡的输出信号,以便与麦克风的输入信号进行混音,对于音频处理的技术,主要有如下几种: 采集麦克风输入 采集声卡输出 将音频数据送入声卡进行播放 对多路音频输入进行混音处理 ...

  6. PowerShell:因为在此系统上禁止运行脚本

    在安装chocolatey(官网)的时候,不能运行chocolateyInstall.pal脚本文件. 查阅资料后,得出如下解决办法: 首次在计算机上启动 Windows PowerShell 时,现 ...

  7. 2016年,总结篇 之 VueJS 如何入门(一)

    接着 2016 年的总结,我们来看看 2016年 国内最火且没有之一的前端MVVM 框架 VueJs 虽然 到写文章的这个时间点,VueJs已经发布了 2.1.x 了, 但是对于很多 Vuejs 的初 ...

  8. python之twisted模块安装

    Twisted是一个事件驱动的网络框架. 最近开始学习了解Twisted,首先肯定要安装twisted模块. 但是在cmd下执行:pip install twisted 出现了下面的问题:" ...

  9. Python爬虫:通过关键字爬取百度图片

    使用工具:Python2.7 点我下载 scrapy框架 sublime text3 一.搭建python(Windows版本) 1.安装python2.7 ---然后在cmd当中输入python,界 ...

  10. GTK+基本图元的绘制

    // main.c #include <gtk/gtk.h> static void draw_round_rectangle (cairo_t * cr, double x, doubl ...