1.在说grunt先认识几个grunt配置中的几个单词,concat(合并文件),uglify(压缩文件),jshint(检测代码规范),watch(实时监听修改的文件)

2.grunt是基于nodejs,安装之前需要安装nodejs。

3.开始,进行项目的路径下,cmd——>npm init生成package.json,暂时没有这么多内容的,但是大致就是这样的

4.然后安装grunt : npm install grunt --save-dev               --save-dev这个命令使得package.json文件中出现 “grunt”:“^1.0.1”。

5.安装grunt中的各路插件了:

npm install --save-dev grunt-contrib-concat grunt-contrib-jshint grunt-contrib-sass grunt-contrib-uglify grunt-contrib-watch grunt-contrib-connect

6.建立Gruntfile.js文件开始配置:

module.exports = function(grunt) {

  grunt.initConfig({
pkg: grunt.file.readJSON('package.json'),
concat: {
//合并一下两个文件,合并后的文件名字为global.js
dist: {
src: ['slide.js', 'dialog.js'],
dest: 'global.js',
},
},
uglify: {
//压缩合并后的文件
compressjs: {
files: {
'global.min.js': ['global.js']
}
}
},
jshint: {
//检查校验合并后的文件
all: ['global.js']
},
watch: {
//监听文件的改动并变化
scripts: {
files: ['slide.js','dialog.js'],
tasks: ['concat','jshint','uglify']
}
},
}); grunt.loadNpmTasks('grunt-contrib-concat');
grunt.loadNpmTasks('grunt-contrib-jshint');
grunt.loadNpmTasks('grunt-contrib-uglify');
grunt.loadNpmTasks('grunt-contrib-watch'); grunt.registerTask('concatjs',['concat']);
grunt.registerTask('compressjs',['concat','jshint','uglify']);
grunt.registerTask('watchit',['concat','jshint','uglify','watch']);
grunt.registerTask('default'); };

执行grunt watchit,便可以了。

压缩校验合并js之grunt搭建的更多相关文章

  1. Gulpfile.js——编译、压缩、合并js和css文件

    gulp 一个入门教程:http://www.ydcss.com/gulp API文档地址:http://www.gulpjs.com.cn/docs/api/ 我的一个Low版的gulpfile v ...

  2. maven 压缩、合并 js, css

    转载自:http://blog.csdn.net/fangxing80/article/details/17639607 我们知道在 Web 应用开发中为了提高客户端响应速度,需要将页面使用的资源最小 ...

  3. 转:利用node压缩、合并js,css,图片

    1.安装nodejs http://nodejs.org/ 2.安装各自的node package js我用的是UglifyJS github地址:https://github.com/mishoo/ ...

  4. Maven插件wro4j-maven-plugin压缩、合并js、css详解

    1.    在pom.xml文件中,引入wro4j-maven-plugin插件 <plugin> <groupId>ro.isdc.wro4j</groupId> ...

  5. MVC4新功能...压缩和合并js文件和样式文件

    1.在App_Start文件夹中BundleConfig.cs类中添加相应的文件 1.1bundles.Add(new ScriptBundle("~/bundles/adminJs&quo ...

  6. MVC4中压缩和合并js文件和样式文件

    1.在App_Start文件夹中BundleConfig.cs类中添加相应的文件 1.1bundles.Add(new ScriptBundle("~/bundles/adminJs&quo ...

  7. grunt自定义任务——合并压缩css和js

    npm文档:www.npmjs.com grunt基础教程:http://www.gruntjs.net/docs/getting-started/ http://www.w3cplus.com/to ...

  8. 引用:使用grunt 压缩 合并js、css文件

    引用:https://www.jianshu.com/p/08c7babdec65 压缩 js 文件 1.创建一个目录 名为grunt   目录.png 2.在grunt目录下创建一个 src目录,存 ...

  9. Grunt的配置及使用(压缩合并js/css)

    Grunt的配置及使用(压缩合并js/css) 安装 前提是你已经安装了nodejs和npm. 你能够在 nodejs.org 下载安装包安装.也能够通过包管理器(比方在 Mac 上用 homebre ...

随机推荐

  1. pyhanlp 文本聚类详细介绍

    文本聚类 文本聚类简单点的来说就是将文本视作一个样本,在其上面进行聚类操作.但是与我们机器学习中常用的聚类操作不同之处在于. 我们的聚类对象不是直接的文本本身,而是文本提取出来的特征.因此如何提取特征 ...

  2. Maven install报MojoExecutionException

    [ERROR] Failed to execute goal org.apache.maven.plugins:maven-assembly-plugin:2.2-beta-5:assembly (m ...

  3. TCP加速锐速SS(ServerSpeeder)破解版一键安装

    速(serverspeeder),是一款TCP加速程序,能够增强VPS/服务器连接的稳定性,且有效的提高服务器的带宽利用率,进而提高访问速度.老左经常看到论坛.群里有用户提到锐速这款软件可以提高VPS ...

  4. 关于libusb-win32开发的经验

    引用:http://blog.sina.com.cn/s/blog_4b4b54da010153zb.html 作为设备开发者, 一般需要让设备与上位机PC通讯, 我们往往考虑采用以下几种接口: rs ...

  5. Windows消息【一】 消息队列

    看了MSDN后,以下是我个人的理解! 消息能够被分为「队列化消息」和「非队列化消息」. 队列化消息是指当程序发生某事件时,由Windows主动捕获并把消息放入系统消息队列中,而程序在运行时会初始化一个 ...

  6. TabControl TabPage添加关闭按钮

    自定义控件代码如下: using System.Drawing; using System.Windows.Forms; namespace Demo.UC { public class KKTab ...

  7. js 把字符串保存为txt文件,并下载到本地

    代码如下 exportRaw('text.txt','123123123') function fakeClick(obj) { var ev = document.createEvent(" ...

  8. elasticsearch 口水篇(8)分词 中文分词 ik插件

    先来一个标准分词(standard),配置如下: curl -XPUT localhost:9200/local -d '{ "settings" : { "analys ...

  9. scroll家族属性

    上一篇主要分析了一下offset家族属性,本篇文章则主要是来分析一下scroll家族属性. 首先,scroll家族包括4个属性: 网页正文宽度:document.body.scrollWidth; 网 ...

  10. Hive之示例一:基本操作与案例

    1. 创建数据库,切换数据库 create database testdb; use testdb; 2. 创建管理表 create table emp( empno int, empname str ...