#Grunt

Grunt安装与环境配置

公司项目还没有前后端分离,而前端是使用node.js搭建起来的,现在需要自己动手开发,故学习下并做为记录防止以后忘记。grunt依赖node.js,所以在安装之前确保你安装了Node.js。然后开始安装Grunt实际上,安装的并不是Grunt,而是Grunt-cli,也就是命令行的Grunt,这样你就可以使用grunt...
代码星球 ·2021-02-18

Grunt之预处理

一、grunt预处理简述grunt的注册任务函数本身会对传入的参数和配置对象里的相关属性进行一定的预处理,方便任务函数进行操作。grunt的registerTask方法和registerMultiTask方法会进行不同的预处理。 二、预处理参数grunt命令通过grunttaskname:arg1:arg2形...
代码星球 ·2020-12-24

巧用cheerio重构grunt-inline

grunt-inline是楼主之前写的一个插件,主要作用是把页面带了__inline标记的资源内嵌到html页面去。比如下面的这个script标签。<scriptsrc="main.js?__inline"></script>技术难度不高,主要就是通过正则将符合条件的script标签等匹配出来。...

grunt源码解析:整体运行机制&grunt-cli源码解析

前端的童鞋对grunt应该不陌生,前面也陆陆续续的写了几篇grunt入门的文章。本篇文章会更进一步,对grunt的源码进行分析。文章大体内容内容如下:grunt整体设计概览grunt-cli源码分析grunt-cli模块概览grunt-cli源码分析写在后面grunt主要由三部分组成。其中,grunt-cli是本文的讲...

grunt实用总结

文章梗概如下:如何让Grunt在项目跑起来初识:Gruntfile.js术语扫盲:task&target如何运行任务任务配置自定义任务文件通配符:glob模式文件通配符:例子常用API如何初始化Gruntfile.js通过模板初始化Gruntfile.js获取命令行参数插件编写入门简介:http://www.c...
代码星球 ·2020-07-24

git笔记:通过给grunt-inline打tag看tag操作

晚上review了下grunt-inline的issues,看到有个兄弟pullrequest,修正了0.3.0版本的一个bug。于是就merge了下,然后发布了0.3.1版本(这里)。npmpublish后,突然想到一个问题,发布了这么多个版本了,但好像都没有打过tag,这个不利于版本回溯以及bugtrace。svn...

grunt-inline:一个资源内嵌插件

将引用的外部资源,如js、css、img等,内嵌到引用它们的文件里去。在项目中,出于某些原因,有的时候我们需要将一些资源,比如js脚本内嵌到页面中去。比如我们的html页面中有这么段小脚本,如果这么直接发布到线上,就会多了一个请求,这从性能优化的角度来说是不合理的。<scriptsrc="js/log.js"&g...

chrome下的Grunt插件断点调试——基于node-inspector

之前调试grunt插件时,都是通过人肉打log来调试。不仅效率低,而且会产生一堆无用的代码。于是简单google了下node断点调试的方法,总结了下。借助node-inspector,我们可以通过Chrome浏览器的调试工具来调试。npminstall-gnode-inspector node-inspect...

Yeoman的好基友:Grunt

1、这是我们的生活文件压缩:YUICompressor、GoogleClosure文件合并:fiddler+qzmin文件校验:jshint雪碧图:cssGagasass编译:sass/compass文件打包:require+r.js/seajs+wpm。。。2、究竟痛在哪里下载难/(版本)管理难YUICompress...
代码星球 ·2020-07-24

Grunt一辈子的好基友:yeoman

yeoman主要包含了三个工具:yo、grunt、bower。我们先看下这三个工具分别是做什么的:yo:脚手架工具,主要作用是创建项目骨架(跟grunt-init有点像)。grunt:构建工具,主要用来运行各种任务,比如文件压缩、合并、打包等。bower:主要用来做前端资源依赖管理,跟npm很像,区别在于:npm管理的...
代码星球 ·2020-07-24

前端自动化工具 -- Grunt 使用简介

grunt是什么,grunt就是个东西.. grunt作为一个前端构建工具,有资源压缩,代码检查,文件合并等功能。 下面就简单了解grunt的使用。 一、环境配置grunt是基于nodejs的,所以需要一个 nodejs 环境,未了解的可以来这看看还是在windows下...

利用grunt-contrib-connect和grunt-connect-proxy搭建前后端分离的开发环境

前后端分离这个词一点都不新鲜,完全的前后端分离在岗位协作方面,前端不写任何后台,后台不写任何页面,双方通过接口传递数据完成软件的各个功能实现。此种情况下,前后端的项目都独立开发和独立部署,在开发期间有2个问题不可避免:第一是前端调用后台接口时的跨域问题(因为前后端分开部署);第二是前端脱离后台服务后无法独立运行。本文总...

Grunt

  前端技术的发展真的很快,15年还在流行grunt,而现在随着gulp的大量使用,以及webpack越来越流行,grunt基本上要被淘汰了。学习进度跟不上技术发展进度,实在是说不出的感觉。本文将介绍可能将过时的grunt 安装  Grunt和Grunt插件是通过npm安装并管理的。在学习Grunt前,需要先...
代码星球 ·2020-05-24

使用grunt实现自动化单元测试

闲话不多说~使用步骤1.安装插件  npminstallgrunt-contrib-qunit--save-dev2.加载包含"qunit"任务的插件  grunt.loadNpmTasks('grunt-contrib-qunit');3.添加到执行任务列表  grunt.registerTask('default'...

yeoman bower grunt等安装

grunt-beginner前端自动化工具:http://www.imooc.com/learn/30官方站点:http://gruntjs.com/安装指令:sudonpminstall-ggrunt-cli验证方面:grunt见到上图,就是grunt已经安装成功。 yeoman自动将最佳时间和工具整合进来...
代码星球 ·2020-05-17
首页上一页12下一页尾页