1 grunt是什么

官方网站解释的很清楚,http://gruntjs.com/ http://gruntjs.cn/

它是一种javascript任务运行器,对于需要反复重复的任务,例如压缩、编译、单元测试、代码检查等,自动化工具可以减轻你的劳动,简化你的工作。

grunt的安装请参考官方文档。

2 grunt 插件开发步骤

  1. Install grunt-init with npm install -g grunt-init
  2. Install the gruntplugin template with git clone git://github.com/gruntjs/grunt-init-gruntplugin.git ~/.grunt-init/gruntplugin
  3. Run grunt-init gruntplugin in an empty directory.
  4. Run npm install to prepare the development environment.
  5. Author your plugin.
  6. Run npm publish to publish the Grunt plugin to npm!

3 使用webstorm调试

WebStrom是由jetbrains开发的javascript IDE,是付费的,功能非常强大。

1,首先要确定安装了nodejs

2,打开webstrom,并open上述构建好的项目目录

3,工具栏Run—> Edit configrations

4,点击绿色图标,选择Node.js

其中Javascript file: 要选择grunt程序,而不是Gruntfile.js

Application parameters: test,表示启动 grunt test 这个命令。

 

至此就可以对gurnt进行debug运行了。

Grunt 插件开发与调式的更多相关文章

  1. grunt 插件开发注意事项

    grunt的插件机制 task.loadNpmTasks = function(name) { var root = path.resolve('node_modules'); var tasksdi ...

  2. 快速开发Grunt插件----压缩js模板

    前言 Grunt是一款前端构建工具,帮助我们自动化搭建前端工程.它可以实现自动对js.css.html文件的合并.压缩等一些列操作.Grunt有很多插件,每一款插件实现某个功能,你可以通过npm命名去 ...

  3. 如何利用Grunt生成对应的Source Map文件,线上代码压缩使用chrome浏览器便于调式

    如何利用Grunt生成对应的Source Map文件,线上代码压缩使用chrome浏览器便于调式 首先我们来说说为何要生成sourceMap文件呢?简单的说,sourceMap是为了压缩后的代码调式提 ...

  4. gulp和grunt的区别

    1. Grunt -> Gulp 早些年提到构建工具,难免会让人联想到历史比较悠久的Make,Ant,以及后来为了更方便的构建结构类似的Java项目而出现的Maven.Node催生了一批自动化工 ...

  5. gulp初体验记录(简介、插件开发介绍)

    目前用的业界比较知名的三个前端构建工具:grunt.gulp.fis,自己此前一直都是只在用grunt,fis看过一点,gulp则一直都没注意过,直到最近发现好像用的人越来越多,所以今天也就抽了点时间 ...

  6. Gulp vs Grunt 前端构建工具对比

    Gulp vs Grunt 前端工程的构建工具对比 1. Grunt -> Gulp 早些年提到构建工具,难免会让人联想到历史比较悠久的Make,Ant,以及后来为了更方便的构建结构类似的Jav ...

  7. 前端工程的构建工具对比 Gulp vs Grunt

    1. Grunt -> Gulp 早些年提到构建工具,难免会让人联想到历史比较悠久的Make,Ant,以及后来为了更方便的构建结构类似的Java项目而出现的Maven.Node催生了一批自动化工 ...

  8. Node开发项目管理工具 Grunt 对比 Gulp

    转自Gulp vs Grunt 1. Grunt -> Gulp 早些年提到构建工具,难免会让人联想到历史比较悠久的Make,Ant,以及后来为了更方便的构建结构类似的Java项目而出现的Mav ...

  9. 初学seaJs模块化开发,利用grunt打包,减少http请求

    原文地址:初学seaJs模块化开发,利用grunt打包,减少http请求 未压缩合并的演示地址:demo2 学习seaJs的模块化开发,适合对seajs基础有所了解的同学看,目录结构 js — —di ...

随机推荐

  1. 修改xcode代码风格设置

    1.找到文件:/Applications/Xcode.app/Contents/PlugIns/IDECodeSnippetLibrary.ideplugin/Contents/Resources/S ...

  2. c语言sizeof与strlen的区别

    #include <stdio.h> #include <stdlib.h> #include <string.h> //strlen与sizeof的区别 //st ...

  3. python使用deque实现fifo(先进先出)

    #2:deque还提供了append 和pop方法,在序列的两端都能以相同的速度执行#例子2:使用deque实现fifo(先进先出),如下:from collections import dequei ...

  4. maven java.lang.OutOfMemoryError:PermGEn space

    配置环境变量: JAVA_OPTS-Xms512m -Xmx1024m -XX:PermSize=256m -XX:MaxPermSize=512m   MAVEN_OPTS-Xms256m -Xmx ...

  5. Laravel-表单篇-controller

    (慕课网_轻松学会Laravel-表单篇_天秤vs永恒老师_http://www.imooc.com/learn/699) Controller 1.Controller-Request //Requ ...

  6. java动态代理和cglib动态代理

    动态代理应用广泛,Spring,Struts等框架很多功能是通过动态代理,或者进一步封装来实现的. 常见的动态代理模式实现有Java API提供的动态代理和第三方开源类库CGLIB动态代理. Java ...

  7. Java中普通代码块,构造代码块,静态代码块的代码演示样例及区分

    //运行顺序:(优先级从高到低.)静态代码块>mian方法>构造代码块>构造方法. 当中静态代码块仅仅运行一次.构造代码块在每次创建对象是都会运行. 1 普通代码块 <span ...

  8. AssemblyInfo.cs文件的作用

    在asp.net中有一个配置文件AssemblyInfo.cs主要用来设定生成的有关程序集的常规信息dll文件的一些參数,以下是默认的AssemblyInfo.cs文件的内容详细介绍 //是否符合公共 ...

  9. swift调用相机和相册

    简单实现swift调用相机和相册的功能,分享代码与学习swift的童鞋共同进步 import UIKit class ViewController: UIViewController,UIImageP ...

  10. Java第四周学习日记

    Day01 双列集合: 在现实生活中有些数据是以映射关系存在的,也就是成对存在的,比如夫妻等.单例集合无法表现出映射关系,所以学习双列集合. 双列集合无迭代器. 1.Map 双列集合: ——————— ...