Grunt 插件开发与调式
1 grunt是什么
官方网站解释的很清楚,http://gruntjs.com/ http://gruntjs.cn/
它是一种javascript任务运行器,对于需要反复重复的任务,例如压缩、编译、单元测试、代码检查等,自动化工具可以减轻你的劳动,简化你的工作。
grunt的安装请参考官方文档。
2 grunt 插件开发步骤
- Install grunt-init with
npm install -g grunt-init
- Install the gruntplugin template with
git clone git://github.com/gruntjs/grunt-init-gruntplugin.git ~/.grunt-init/gruntplugin
- Run
grunt-init gruntplugin
in an empty directory.- Run
npm install
to prepare the development environment.- Author your plugin.
- 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 插件开发与调式的更多相关文章
- grunt 插件开发注意事项
grunt的插件机制 task.loadNpmTasks = function(name) { var root = path.resolve('node_modules'); var tasksdi ...
- 快速开发Grunt插件----压缩js模板
前言 Grunt是一款前端构建工具,帮助我们自动化搭建前端工程.它可以实现自动对js.css.html文件的合并.压缩等一些列操作.Grunt有很多插件,每一款插件实现某个功能,你可以通过npm命名去 ...
- 如何利用Grunt生成对应的Source Map文件,线上代码压缩使用chrome浏览器便于调式
如何利用Grunt生成对应的Source Map文件,线上代码压缩使用chrome浏览器便于调式 首先我们来说说为何要生成sourceMap文件呢?简单的说,sourceMap是为了压缩后的代码调式提 ...
- gulp和grunt的区别
1. Grunt -> Gulp 早些年提到构建工具,难免会让人联想到历史比较悠久的Make,Ant,以及后来为了更方便的构建结构类似的Java项目而出现的Maven.Node催生了一批自动化工 ...
- gulp初体验记录(简介、插件开发介绍)
目前用的业界比较知名的三个前端构建工具:grunt.gulp.fis,自己此前一直都是只在用grunt,fis看过一点,gulp则一直都没注意过,直到最近发现好像用的人越来越多,所以今天也就抽了点时间 ...
- Gulp vs Grunt 前端构建工具对比
Gulp vs Grunt 前端工程的构建工具对比 1. Grunt -> Gulp 早些年提到构建工具,难免会让人联想到历史比较悠久的Make,Ant,以及后来为了更方便的构建结构类似的Jav ...
- 前端工程的构建工具对比 Gulp vs Grunt
1. Grunt -> Gulp 早些年提到构建工具,难免会让人联想到历史比较悠久的Make,Ant,以及后来为了更方便的构建结构类似的Java项目而出现的Maven.Node催生了一批自动化工 ...
- Node开发项目管理工具 Grunt 对比 Gulp
转自Gulp vs Grunt 1. Grunt -> Gulp 早些年提到构建工具,难免会让人联想到历史比较悠久的Make,Ant,以及后来为了更方便的构建结构类似的Java项目而出现的Mav ...
- 初学seaJs模块化开发,利用grunt打包,减少http请求
原文地址:初学seaJs模块化开发,利用grunt打包,减少http请求 未压缩合并的演示地址:demo2 学习seaJs的模块化开发,适合对seajs基础有所了解的同学看,目录结构 js — —di ...
随机推荐
- 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+ ...
- shiro内置过滤器研究
anon org.apache.shiro.web.filter.authc.AnonymousFilter authc org.apache.shiro.web.filter.authc.FormA ...
- CSS3 div水平、垂直居中,IE9以上、Firefox、Chrome均正常
<!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content ...
- 使用PHPExcel导入导出excel格式文件
使用PHPExcel导入导出excel格式文件 作者:zccst 因为导出使用较多,以下是导出实现过程. 第一步,将PHPExcel的源码拷贝到项目的lib下 文件包含:PHPExcel.ph ...
- [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 ...
- Android AdapterView View的复用机制 分析
对于ListView.GridView相信大家都不陌生,重写个BaseView,实现对于的几个方法,然后就完毕了我们的界面展示.而且在大部分情况下,我们载入特别多的Item也不会发生OOM,大家也都明 ...
- 如何把java代码转换成smali代码
1.概述 Smali是Android系统中Dalvik虚拟机指令语言,在apk逆向过程中有许多工具可以把smali代码转化成java代码.但是在学习Smali语法的过程中,有时候需要进行java代码和 ...
- DOM事件处理程序-事件对象-键盘事件
事件流: 事件流--描述的是从页面中接受事件的顺序 IE ---事件冒泡流:即事件最开始由最具体的元素(文档中嵌套层次最深的那个节点)接收,然后逐级向上传播至最不具体的那个节点(文档). Netsc ...
- 学习CAS实现SSO单点登录
学习CAS实现SSO单点登录 网上找了几篇比较详细的教程,在这记录一下: 原理: CAS实现SSO单点登录原理 教程: 1.CAS实现单点登录(SSO)经典完整教程 2.SSO之CAS单点登录实例演示 ...
- C语言中的结构体和C++中的结构体以及C++中类的区别
c++中结构体可以定义一个函数 C中的结构体和C++中结构体的不同之处:在C中的结构体只能自定义数据类型,结构体中不允许有函数,而C++中的结构体可以加入成员函数. C++中的结构体和类的异同: 一. ...