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. awk实践积累

    #cat iii |awk '{max=$2;min=$2;for (i=2;i<=NF;i++) if ($i>max) max=$i fi} {for (i=2;i<=NF;i+ ...

  2. shiro内置过滤器研究

    anon org.apache.shiro.web.filter.authc.AnonymousFilter authc org.apache.shiro.web.filter.authc.FormA ...

  3. CSS3 div水平、垂直居中,IE9以上、Firefox、Chrome均正常

    <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content ...

  4. 使用PHPExcel导入导出excel格式文件

    使用PHPExcel导入导出excel格式文件  作者:zccst  因为导出使用较多,以下是导出实现过程.  第一步,将PHPExcel的源码拷贝到项目的lib下  文件包含:PHPExcel.ph ...

  5. [Node.js] Use "prestart" in scripts

    Usually we run : npm start to start an app, then we we might call other script to do something: npm ...

  6. Android AdapterView View的复用机制 分析

    对于ListView.GridView相信大家都不陌生,重写个BaseView,实现对于的几个方法,然后就完毕了我们的界面展示.而且在大部分情况下,我们载入特别多的Item也不会发生OOM,大家也都明 ...

  7. 如何把java代码转换成smali代码

    1.概述 Smali是Android系统中Dalvik虚拟机指令语言,在apk逆向过程中有许多工具可以把smali代码转化成java代码.但是在学习Smali语法的过程中,有时候需要进行java代码和 ...

  8. DOM事件处理程序-事件对象-键盘事件

    事件流: 事件流--描述的是从页面中接受事件的顺序 IE  ---事件冒泡流:即事件最开始由最具体的元素(文档中嵌套层次最深的那个节点)接收,然后逐级向上传播至最不具体的那个节点(文档). Netsc ...

  9. 学习CAS实现SSO单点登录

    学习CAS实现SSO单点登录 网上找了几篇比较详细的教程,在这记录一下: 原理: CAS实现SSO单点登录原理 教程: 1.CAS实现单点登录(SSO)经典完整教程 2.SSO之CAS单点登录实例演示 ...

  10. C语言中的结构体和C++中的结构体以及C++中类的区别

    c++中结构体可以定义一个函数 C中的结构体和C++中结构体的不同之处:在C中的结构体只能自定义数据类型,结构体中不允许有函数,而C++中的结构体可以加入成员函数. C++中的结构体和类的异同: 一. ...