一、安装grunt:

npm install -g grunt-cli //安装
npm install grunt –save-dev //安装Grunt最新版本到项目目录中,并将其添加到devDependencies内
grunt –version //出现grunt -cli 和 grunt的版本号即安装成功

二、配置packge.json文件:
【代码中去掉注释】

module.exports = function(grunt) {

  // Project configuration.
grunt.initConfig({
pkg: grunt.file.readJSON('package.json'), transport: {
webqq: {
files: {
//零时文件夹 提取依赖的文件
".build": ["main.js","range.js","scale.js","drag.js"]
}
}
}, concat: {
webqq: {
files: {
//合并后的新文件
"dist/main.js": [".build/main.js",".build/range.js",".build/scale.js",".build/drag.js"]
}
}
}, uglify: {
webqq: {
files: {
//压缩的文件
"dist/main.min.js": "dist/main.js"
}
}
} }); //加载插件
grunt.loadNpmTasks('grunt-cmd-transport');
grunt.loadNpmTasks('grunt-cmd-concat');
grunt.loadNpmTasks('grunt-contrib-uglify'); grunt.registerTask('default', ['transport','concat','uglify']); }; };

四、在命令行输入:

grunt
就实现了合并,压缩的操作;在dist目录下找到相应的文件。

grunt和seajs入门之--提取依赖、合并、压缩js文件的更多相关文章

  1. GruntJs安装及使用入门(自定义grunt任务,合并压缩js、css)

    一.Grunt.js简介(实现自动化) 1)简要说明: 1.GruntJs是基于node的javascript命令行工具,可以自动化构建.测试.生成文档的项目管理工具: 2.使用GruntJs可以自动 ...

  2. 如何使用grunt压缩js文件

    jQuery在使用grunt,bootstrap在使用grunt,百度UEditor在使用grunt,你没有理由不学.不用! 1. 前言 各位web前端开发人员,如果你现在还不知道grunt或者听说过 ...

  3. 吉特仓储管系统(开源)--使用Grunt压缩JS文件

    在吉特仓储管理系统开发的过程中大量使用到了JS,随着JS文件的增多我们需要对JS进行有效的管理,同时也要对JS文件进行一些压缩.文本用于记录一下使用grunt压缩JS的操作步骤,便于遗忘之后记录查找, ...

  4. asp.net core合并压缩资源文件引发的学习之旅

    0. 在asp.net core中使用BuildBundlerMinifier合并压缩资源文件 在asp.net mvc中可以使用Bundle来压缩合并css,js 不知道的见:http://www. ...

  5. uglifyjs 合并压缩 js, clean-css 合并压缩css

    本文主要介绍如何通过CLI命令行(也就是终端或者cmd打开的那个shell窗口)实现 js和 css 的合并压缩. uglifyjs 合并压缩 js: 1.安装node 这一步就不多说了,下载node ...

  6. asp.net core合并压缩资源文件(转载)

    在asp.net core中使用BuildBundlerMinifier合并压缩资源文件 在asp.net mvc中可以使用Bundle来压缩合并css,js 不知道的见:http://www.cnb ...

  7. 使用grunt合并压缩js、css文件

    需要了解的知识: 1.nodejs的安装与命令行使用 2.nodejs安装应用 3.grunt的初步了解 本文已假定读者已经熟悉以上知识. 好,我们继续: 任务1:将src目录下的所有zepto及插件 ...

  8. 简单使用grunt、bower工具合并压缩js和css

    前段时间因为项目中的报表写了一个Jquery插件,开源到github上,参考以往大神们写的插件的姿势,决定搞了像模像样一点.言归正传.前端工程师对这些工具:Node,bower,grunt,npm这些 ...

  9. grunt 合并压缩js和css文件(二)

    具体node及文件配置请看: grunt 安装使用(一) 要压缩的文件 --src/ ajax.js assets.js touch.js zepto.js 目录结构: dist/ node_modu ...

随机推荐

  1. 自译Solr in action中文版

    文件夹 Part 1 初识 SOLR 1 Solr 简单介绍 2 開始熟悉 Solr 3 Solr 核心概念 4 配置 Solr 5 建立索引 6 文本分析 Part 2 Solr 核心功能 7 发起 ...

  2. Android: 亲測解决模拟器启动慢的问题

    1.首先在相应的sdk manager里面下载一个4.03以上的api. 这里我选择的是4.2.2 (api17) 2.选择里面的" Intel Hardware Accelerated E ...

  3. IOS开发之Iphone和Ipad应用程序图标和启动动画

    本文转载至 http://blog.csdn.net/yesjava/article/details/8782060 当我们用xcode开发iphone和ipad应用程序的时候,我们可以用一下表中所显 ...

  4. SAM4E单片机之旅——9、UART与MCK之MAINCK

    为得到更高的带宽,需要使用更高的波特率.UART波特率的计算已经介绍过了,现在就尝试下调整外设的时钟频率.可以有多种方法调整外设时钟(MCK)的频率,这里先介绍先主要时钟(MAINCK)的设置,其中包 ...

  5. android studio发布公共类库到服务器maven仓库

    在上一篇中提到了怎么创建私有maven库,这篇主要结合android studio的使用,直接进入正题,看以下步骤 1.创建android项目 创建Project,然后加一个library的modul ...

  6. MQ发送的消息都到了死信队列中了

    MQ在发送消息的时候,设置的过期时间太短.(昨天项目上线遇到了,开发中也遇到一次.)谨记!!!

  7. Android Studio 卡顿解决

    每次升级/安装 Android Studio 之后最好都修改一下这个参数:到 Android Studio 安装目录,找到 bin/studio(64?).vmoptions(文件名可能因操作系统而不 ...

  8. c++中class与struct的区别

    0. 结构是一种用关键字struct声明的自定义数据类型.与类相似,也可以包含构造函数,常数,字段,方法,属性,索引器,运算符和嵌套类型. 1.结构在堆栈中创建,是值类型,而类是引用类型.每当需要一种 ...

  9. Algorithm: Euclid's algorithm of finding GCD

    寻找最大公约数方法 代码如下: int gcd (int a, int b) { return b ? gcd (b, a % b) : a; } 应用:求最小公倍数 代码如下: int lcm (i ...

  10. 物体position:absolute后设置left:50%发生的有趣小事

    今天在重构ui控件中3秒hint提示框样式,发现了一个有趣的小事,特发个文章记录一下,方便自己日后看一下 一 准备知识 ①一个已设置宽高的块状元素设置position:absolute后会保持他原来宽 ...