压缩校验合并js之grunt搭建
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搭建的更多相关文章
- Gulpfile.js——编译、压缩、合并js和css文件
gulp 一个入门教程:http://www.ydcss.com/gulp API文档地址:http://www.gulpjs.com.cn/docs/api/ 我的一个Low版的gulpfile v ...
- maven 压缩、合并 js, css
转载自:http://blog.csdn.net/fangxing80/article/details/17639607 我们知道在 Web 应用开发中为了提高客户端响应速度,需要将页面使用的资源最小 ...
- 转:利用node压缩、合并js,css,图片
1.安装nodejs http://nodejs.org/ 2.安装各自的node package js我用的是UglifyJS github地址:https://github.com/mishoo/ ...
- Maven插件wro4j-maven-plugin压缩、合并js、css详解
1. 在pom.xml文件中,引入wro4j-maven-plugin插件 <plugin> <groupId>ro.isdc.wro4j</groupId> ...
- MVC4新功能...压缩和合并js文件和样式文件
1.在App_Start文件夹中BundleConfig.cs类中添加相应的文件 1.1bundles.Add(new ScriptBundle("~/bundles/adminJs&quo ...
- MVC4中压缩和合并js文件和样式文件
1.在App_Start文件夹中BundleConfig.cs类中添加相应的文件 1.1bundles.Add(new ScriptBundle("~/bundles/adminJs&quo ...
- grunt自定义任务——合并压缩css和js
npm文档:www.npmjs.com grunt基础教程:http://www.gruntjs.net/docs/getting-started/ http://www.w3cplus.com/to ...
- 引用:使用grunt 压缩 合并js、css文件
引用:https://www.jianshu.com/p/08c7babdec65 压缩 js 文件 1.创建一个目录 名为grunt 目录.png 2.在grunt目录下创建一个 src目录,存 ...
- Grunt的配置及使用(压缩合并js/css)
Grunt的配置及使用(压缩合并js/css) 安装 前提是你已经安装了nodejs和npm. 你能够在 nodejs.org 下载安装包安装.也能够通过包管理器(比方在 Mac 上用 homebre ...
随机推荐
- 读DataSnap源代码(二)
program Project1; {$APPTYPE GUI} {$R *.dres} uses Vcl.Forms, Web.WebReq, IdHTTPWebBrokerBridge, Form ...
- mysql主从复制--重置操作reset master, reset slave
本文介绍reset master, reset slave的作用. reset master 在master上执行 mysql > RESET MASTER 作用包括: 删除binlog索引文件 ...
- php结合phantomjs实现网页截屏、抓取js渲染的页面
首先PhantomJS快速入门 PhantomJS是一个基于 WebKit 的服务器端 JavaScript API.它全面支持web而不需浏览器支持,其快速,原生支持各种Web标准: DOM 处理, ...
- R基于Bayes理论实现中文人员特性的性别判定
参见 基于中文人员特征的性别判定方法 理论,告诉一个名字,来猜猜是男是女,多多少少有点算命的味道.此命题是一种有监督的学习方法,从标注好的训练数据学习到一个预测模型,然后对未标注的数据进行预测. 1 ...
- Cygwin使用3-修改Cygwin的默认启动路径
原先启动Cygwin后,pwd显示: C:\Documents and Settings\Administrator@IBM-EBDC0EAC4B7 ~$ pwdC:\Documents and Se ...
- [Android] 配置build.gradle 动态传参
(1)一个Android工程中有一个build.gradle是负责Project范围的,而Module中又有各自的build.gradle是专门负责模块的. (2)在Gradle中Task是一等公民, ...
- Howto Building GNU Toolchains
[REF: https://wiki.linaro.org/WorkingGroups/ToolChain/BuildingGNUToolchains] This page is a work in ...
- STL基础--容器
容器种类 序列容器(数组,链表) Vector, deque, list, forward list, array 关联容器(二叉树),总是有序的 set, multiset根据值排序,元素值不能修改 ...
- C/C++基础--模板与泛型编程
模板参数 函数模板,编译器根据实参来为我们推断模板实参. 模板中可以定义非类型参数,表示一个值而非一个类型,这些值必须是常量表达式,从而允许编译器在编译时实例化模板. 非类型参数可以是整型,或者一个指 ...
- Hadoop概念学习系列之再谈hadoop集群里的本地模式、伪分布模式和全分布模式(三十七)
能看懂博主我此博文,相信你已经有了一定基础了. 对于本地模式.伪分布模式和全分布模式的概念,这里,我不多赘述.太多资料和博客,随便在网上一搜就好. 比如<hadoop实战 第二版>陆嘉恒老 ...