grunt专题
谈谈Grunt,NPM,Gulp
随着前端工程化的趋势,产生了越来越多的构建工具,而其中比较优秀的就是grunt,npm,gulp,今天我来说说这三者间的区别以及他们的优缺点. 相信一般前端开发者选择构建工具的时候,更多的是看个人习惯以及团队的情况.相信这三个构建工具总有一个会适合你的,我们先来看看grunt. Grunt grunt是目前社区最成熟,插件支持最多的一个构建工具,不过它的配置项之多也常常被人诟病.下面
Grunt VS Gulp
前期准备 windows7noderubysass+compass grunt篇 新建一个grunt_demo 目录，用compass 创建一个项目 mkdir grunt_democd grunt_democompass init 打开CMD，安装grunt-cli到全局环境 npm install -g grunt-cli 注意，安装grunt-cli并不等于安装了
JavaScript自动化构建工具grunt、gulp、webpack介绍
前端开发自动化工作流工具，JavaScript自动化构建工具grunt、gulp、webpack介绍 前端自动化，这样的一个名词听起来非常的有吸引力，向往力。当今时代，前端工程师需要维护的代码变得及为庞大和复杂，代码维护、打包、发布等流程也变得极为繁琐，同时浪费的时间和精力也越来越多，当然人为的错误也随着流程的增加而增加了更多的出错率。致使每一个团队都希望有一种工具，能帮助整个团队在开发中能精简
Grunt插件之cssmin--ccs压缩与合并
本来想写一片比较完成的文章来介绍这个工具，但是查看github上的文档<<<传送门>>>，说明文档少的简直是可怜，姑且记下github上面的两个例子吧。 前面的步骤无非是安装grunt-cli,创建grunt项目等等事件，如果有不明白的请移步Grunt插件之uglify代码js代码压缩与合并 查看，这里只讲到Gruntfile.js的配置： css文件合并 module.exports =
Grunt插件之uglify--js代码压缩与合并
平时在开发项目的时候，都是在本地测试，加载代码都是走localhost，页面刷新基本是秒出，所以没有考虑js文件的大小。最近项目上线，部署到了服务器上之后，测试的时候发现加载速度特别慢，一查看网络，发现有的js文件加载时间居然超过1s。没办法，把代码压缩看看。果然压缩好之后加载快了很多。而将代码压缩和混淆之后，也能提高网站的安全性。 下面是使用grunt的uglify插件的安装和使用
Linux搭建(nodejs + grunt + compass) 开发环境
由于工作原因，需要写一些前端页面。有尝试用notepad++编辑，效率着实不高，感觉也挺low，于是网上查阅相关资料，结合一些自己的理解，动手搭建(nodejs + grunt + compass) 开发环境，从而简化提高开发效率。 工具安装 1.安装Nodejs Grunt需要Nodejs的支持，所以我们先安装Nodejs。直接进入Nodejs官网 中根据自己的系统选择下载。我这里
前端打包工具的发展历程、思路(grunt,gulp,webpack,vite)
现在前端发展真快，需要学的东西太多了，下面总结下前端打包的发展过程，便于区分和选择学习。 什么是前端打包 前端打包是指将多个JavaScript文件、CSS文件、图片等资源进行合并和优化处理,并输出为一个或多个文件的过程。这样做的目的是减少页面加载时需要发起的HTTP请求数量,优化页面加载速度,提升用户体验。 发展阶段 手工合并阶段 最早期前端开发只有少量的JS和CSS文件。开发人员会手
SAPUI5 (37) - 使用 Grunt 实现 Cross Origin 代理
上一篇介绍使用 SAP Web IDE 代理来解决 Cross-origin 问题。如果使用 Eclipse 作为开发工具，可以使用 Simple proxy servlet 来测试，作为 cross-origin 的代理。但 SAP Web IDE 编写的代码，并不能在不做任何修改的情况下运行。为了能较好地实现代码移植，另外一个比较好的方法是使用 Grunt。Grunt 是基于 JavaScri
Grunt 合并编译less文件
Gruntfile.js 配置项： // 安装依赖// npm install -g grunt-cli// npm install --save-dev grunt// npm install --save-dev grunt-contrib-concat// npm install --save-dev grunt-contrib-less// npm install --save
Grunt打包GMU组件 报错处理
莫Q群的大神推荐移动GMU组件，GMU是基于zepto的mobile UI组件库，提供webapp、pad端简单易用的UI组件，官网：http://gmu.baidu.com/具有以下特点： 简单易用 轻量级 文档丰富，自定义下载 专业稳定 丰富实用UI组件 开源免费 基础版本中只实现了能通用的部分，而其他可能通用的部分都是通过插件的形式来扩展，需要为GMU组件量身定制了一套基于G
Grunt打包前端代码教程
详细教程 http://blog.csdn.net/wangfupeng1988/article/details/46418203/ 过程： 1.安装node.js 2.兴建 Grunt项目 包含： F:\App\grunt_test package.json： {"name": "grunt_test","version": "0.1.0"
grunt压缩js文件
参考链接 如果什么都没配置参考上面的链接 如果在公司已经有基本配置，如下 已经用npm install npm install -g grunt-cli 全局安装之后 只需要在build文件夹下，执行命令grunt compressJS，就能压缩到相应的min.js中 在gruntfile.js文件中查看min.js的文件名，去查看自己是否已经压缩好。 注意：提交js压缩之后提交，java
解决grunt-contrib-cssmin压缩默认会删除一些css hack的问题
最近在学习grunt,在用它的一个css压缩插件grunt-contrib-cssmin对以前项目的css文件进行压缩时，发现一些css hack会被删除，配置代码片段如下： cssmin: { minify: { expand: true, cwd: srcName + '/', src: ['*\*/\*.css', '!*.mi
给那些认为Grunt奇怪又难懂的人看的Grunt教程
http://www.html-js.com/article/Grunt-use-for-those-who-believe-that-the-Grunt-strange-and-difficult-to-see-the-Grunt-tutorial 前端工程师经常会被要求做下面这些事： 每次编写一小段CSS和JavaScript，然后在最后把它们拼接起来压缩你的CSS和JavaScr
windows全局安装grunt，yeoman，webpack等，在命令行输入grunt，yo，webpack提示不是内部或外部命令解决方法
这种情况有可能是环境变量没配置好导致的，找到grunt.cmd，yo.cmd，webpack.cmd等文件所在的路径，加入环境变量的PATH当中即可。 操作方法如下，右键我的电脑，点击属性->高级系统设置->在系统变量中找到Path，双击，点击新建，然后输入要添加的路径即可。
使用grunt压缩合并混淆JS脚本
fro from: https://www.cnblogs.com/sybboy/p/4831635.html 折腾一两天，终于学会使用grunt压缩合并混淆JS脚本，小激动，特意记录一下+spm一点意外收获 很长时间没有更新博客了，实在是太忙啦...0.0 ，以下的东西纯粹是记录，不是我原创，放到收藏夹还担心不够，这个以后常用，想来想去，还是放到这里吧,,丢不了..最后一句
【Grunt】Uglification failed.丑化失败（其实是打包失败），Grunt打包错误，
报错信息： SyntaxError:Unexpected token:punc(.) Uglifying source….. Uglification failed. Use –force to continue. Aborted due to warnings 截图如下： 我们看到Line 125036 in .tmp/concat/js/app.angular.js； 我们
我为何放弃Gulp与Grunt，转投npm scripts（下）
本文来源于我在InfoQ中文站翻译的文章，原文地址是：http://www.infoq.com/cn/news/2016/02/earlgrey-ios-functional-ui-test Cory House是“Building Applications with React and Flux”与“Clean Code: Writing Code for Humans”的作者，
我为何放弃Gulp与Grunt，转投npm scripts（中）
本文来源于我在InfoQ中文站翻译的文章，原文地址是：http://www.infoq.com/cn/news/2016/02/gulp-grunt-npm-scripts-part2 Cory House是“Building Applications with React and Flux”与“Clean Code: Writing Code for Humans”的作者，同时也是Plural
我为何放弃Gulp与Grunt，转投npm scripts（上）
本文来源于我在InfoQ中文站翻译的文章，原文地址是：http://www.infoq.com/cn/news/2016/02/gulp-grunt-npm-scripts-part1 Cory House是“Building Applications with React and Flux”与“Clean Code: Writing Code for Humans”的作者，同时也是Plur