grunt 合并压缩js和css文件(二)
具体node及文件配置请看:
grunt 安装使用(一)
要压缩的文件
--src/
ajax.js
assets.js
touch.js
zepto.js
目录结构:
dist/
node_modules/
src/
Gruntfile.js
package.json
package.json是依赖库文件
Gruntfile.js是执行步骤程序
一、js合并压缩
第一次需要先安装grunt。执行 npm install -g grunt-cli 进行安装。如果已经安装,可以忽略。
1.package.json文件
安装所需要的依赖文件
{
"name": "grunt_test",
"version": "1.0.0",
"devDependencies": {
"grunt": "^1.0.1",
"grunt-contrib-concat": "^1.0.1",
"grunt-contrib-uglify": "^3.0.1"
}
}
安装命令:
cnpm install grunt-contrib-concat --save-dev
2.Gruntfile.js
这个文件是配配置文件
module.exports = function (grunt) {
// 项目配置
grunt.initConfig({
pkg: grunt.file.readJSON('package.json'),
uglify:{
js:{
files:[{
expand: true,
cwd: 'src/js',
src: '**/*.js',
dest: 'dist/js'
}]
}
},
concat:{
js:{
src: 'dist/**/*.js',
dest: 'dist/index.min.js'
}
}
});
grunt.loadNpmTasks('grunt-contrib-uglify');
grunt.loadNpmTasks('grunt-contrib-concat');
// 默认任务
grunt.registerTask('default', ['uglify', 'concat']);
}
这里加深的是js 要合并文件,同时需要加载模块及默认执行任务。
执行
grunt
在当前目录下生成dist目录
dist /
index.min.js
同理
css压缩也是一样的。
grunt 合并压缩js和css文件(二)的更多相关文章
- 使用grunt合并压缩js、css文件
需要了解的知识: 1.nodejs的安装与命令行使用 2.nodejs安装应用 3.grunt的初步了解 本文已假定读者已经熟悉以上知识. 好,我们继续: 任务1:将src目录下的所有zepto及插件 ...
- [Asp.net MVC]Bundle合并,压缩js、css文件
摘要 在web优化中有一种手段,压缩js,css文件,减少文件大小,合并js,css文件减少请求次数.asp.net mvc中为我们提供一种使用c#代码压缩合并js和css这类静态文件的方法. 一个例 ...
- GruntJs安装及使用入门(自定义grunt任务,合并压缩js、css)
一.Grunt.js简介(实现自动化) 1)简要说明: 1.GruntJs是基于node的javascript命令行工具,可以自动化构建.测试.生成文档的项目管理工具: 2.使用GruntJs可以自动 ...
- [转][前端优化]使用Combres合并对js、css文件的请求
本文转自:http://www.cnblogs.com/parry/archive/2011/01/28/Reduce_Http_Request_Using_Combres_For_Js_Css.ht ...
- yui压缩JS和CSS文件
CSS和JS文件经常需要压缩,比如我们看到的XX.min.js是经过压缩的JS. 压缩文件第一个是可以减小文件大小,第二个是对于JS文件,默认会去掉所有的注释,而且会去掉所有的分号,也会将我们的一些参 ...
- 简单使用grunt、bower工具合并压缩js和css
前段时间因为项目中的报表写了一个Jquery插件,开源到github上,参考以往大神们写的插件的姿势,决定搞了像模像样一点.言归正传.前端工程师对这些工具:Node,bower,grunt,npm这些 ...
- (转)使用yuicompressor-maven-plugin压缩js及css文件(二)
本文介绍通过使用yuicompressor-maven-plugin插件实现js及css代码的自动压缩,方便集成到持续集成环境中,如jenkins. 一.配置yuicompressor-maven-p ...
- 使用yuicompressor-maven-plugin压缩js及css文件
本文介绍通过使用yuicompressor-maven-plugin插件实现js及css代码的自动压缩,方便集成到持续集成环境中,如jenkins. 一.配置yuicompressor-maven-p ...
- 【前端】一句命令快速合并压缩 JS、CSS
引用自:一句命令快速合并 JS.CSS 在项目开发环境下,我们会把 JS 代码尽可能模块化,方便管理和修改,这就避免不了会出现一个项目自身 JS 文件数量达到10个或者更多. 而项目上线后,会要求将所 ...
随机推荐
- EZOJ #73
传送门 分析 我们知道如果对于模数$P$有$gcd(x,P) = 1$则$x$一定有且仅有一个逆元,可以表示为 $x \equiv \frac{y}{1} (mod P)$ 即为$xy \equiv ...
- Damn Couples ZOJ - 3161
传送门 题目大意 N个人,M组关系,每次选一种关系,如果两个人相邻,则任意删除其中一个,否则不变.问最坏情况下最多能剩多少人. 分析 为了留的人最多,我们可以先将原来不相邻的关系全部说完,这样我们只需 ...
- 存储类型auto,static,extern,register的区别 <转>
变量和函数的属性包括数据类型和数据的存储类别,存储类别指数据在内存中存储方式(静态和动态),包含auto,static,register,extern四种. 内存中.具体点来说内存分为三块:静态区,堆 ...
- Redhat 6 git服务器配置 (git-daemon)
git-daemon是按照git的自己的git协议进行访问git服务 1.git-daemon软件安装 软件仓库见 redhat 6 git 服务器 配置 (http) 2.配置git dae ...
- win10系统遇到的问题解决
1.win10 计算器提示:需要新应用打开此calculator 运行calc,会出现需要新应用打开此Calculator,打开应用商店,找到计算器,仍然可以被使用,我怀疑是我自己在清理PC的注册 ...
- Service Fabric 注意事项
1. ActorTimer和ActorReminder会阻塞一个Actor的其他外部方法调用,即ActorTimer和ActorReminder内部就去未执行完毕之前,该Actor其他方法只能等待. ...
- 十天入门java教程 Day01
这几年一直在想学一门语言,java,Python,php也都看过,但是没有一门是精的.语言学习并不是写出hello world就行了.个人感觉需要静心去学习. java语言是什么? java是一种计算 ...
- tomcat的日志文件权限与启动用户的权限不一致
用户work的文件权限(umask=0002)为 u=rwx,g=rwx,o=rx 但是tomcat的日志文件的权限却是:为什么会不一样呢? 这是因为tomcat在启动(catalina.sh)时会重 ...
- meta标签使用
META标签分两大部分:HTTP标题信息(HTTP-EQUIV)和页面描述信息(NAME). ★HTTP-EQUIV HTTP-EQUIV类似于HTTP的头部协议,它回应给浏览器一些有用的信息,以帮助 ...
- Django之博客系统:自定义模板标签
Django提供了很多内置的模板标签比如{% if %}或者{% block %}Django也允许你创建自己的模板标签(template tags)来执行自定义的动作.当你需要在你的模板中添加功能而 ...