// Project configuration.
module.exports = function(grunt) {
// 使用严格模式
'use strict';
// 这里定义我们需要的任务
grunt.initConfig({
pkg: grunt.file.readJSON('package.json'),
//其他任务
concat: {
options: {
separator: ';',
stripBanners: true
},
dist: {
src: [
"js/EvenUtil.js",
"js/smeite.js",
"js/index.js"
],
dest: "assets/js/default.js"
}
},
uglify: {
options: {
},
dist: {
files: {
'assets/js/default.min.js': 'assets/js/default.js'
}
}
},
cssmin: {
options: {
keepSpecialComments: 0
},
compress: {
files: {
'assets/css/default.css': [
"dist/css/test.css",
"dist/css/common.css",
"dist/css/public.css",
"dist/css/index.css"
]
}
}
},
// 设置任务,删除文件夹
clean: {
dist: 'dist'
},
// 通过sass编译成css文件
sass: {
dist: {
files: [{
expand: true,
cwd: 'scss',
src: ['*.scss'],
dest: 'dist/css',
ext: '.css'
}]
}
},
// 检测改变,自动跑sass任务
watch: {
scripts: {
files: ['scss/*.scss','js/*.js','assets/css/*.css'],
tasks: ['sass','concat','uglify','cssmin'],
options: {
spawn: false
}
}
} });
grunt.loadNpmTasks('grunt-contrib-concat');
grunt.loadNpmTasks('grunt-contrib-uglify');
grunt.loadNpmTasks('grunt-contrib-cssmin');
// 一定要引用着3个模块
grunt.loadNpmTasks('grunt-contrib-clean');
grunt.loadNpmTasks('grunt-contrib-sass');
grunt.loadNpmTasks('grunt-contrib-watch');
// 把需要跑的任务注册到default这里每次运行grunt的时候先删除dist,然后重新编译,最后监测文件夹的情况。
grunt.registerTask('default', ['clean:dist', 'sass:dist', 'concat', 'uglify', 'cssmin', 'watch']);
};

文档说明:样式编辑:scss dist为sass生成,assets为最终压缩成
js编辑:js,assets为最终压缩成

文档说明:样式编辑:scss dist为sass生成,assets为最终压缩成
js编辑:js,assets为最终压缩成

-----sass和grunt的综合应用-----
http://www.gruntjs.net/getting-started --grunt快速入门(创建package.json和Gruntfile.js
准备一份新的 Grunt 项目
一般需要在你的项目中添加两份文件:package.json 和 Gruntfile。

package.json: 此文件被npm用于存储项目的元数据,以便将此项目发布为npm模块。你可以在此文件中列出项目依赖的grunt和Grunt插件,放置于devDependencies配置段内。

Gruntfile: 此文件被命名为 Gruntfile.js 或 Gruntfile.coffee,用来配置或定义任务(task)并加载Grunt插件的。 此文档中提到的 Gruntfile 其实说的是一个文件,文件名是 Gruntfile.js 或 Gruntfile.coffee。

http://blog.csdn.net/playboyanta123/article/details/43230831 安装
http://caibaojian.com/grunt.html --安装

http://caibaojian.com/grunt.html#t3

http://www.cnblogs.com/snandy/archive/2013/03/11/2949177.html --值得研究

npm install <name> --save 安装的同时,将信息写入package.json中

npm init 自动生成package.json

grunt--自常用配置文件--js/样式压缩打包,sass工具整合使用的更多相关文章

  1. JS,html压缩及混淆工具

    现在已经出现了不少有自己特色的: JSMin Javascript compressor Packer Closure Compiler YUI Compressor Pretty Diff Java ...

  2. 转: requirejs压缩打包r.js使用示例 2 (~~很详细的教程)

    这一篇来认识下打包工具的paths参数,在入门一中 就介绍了require.config方法的paths参数.用来配置jquery模块的文件名(jQuery作为AMD模块时id为“jquery”, 但 ...

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

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

  4. r.js压缩打包(require + backbone)项目开发文件

    最近项目稳定了一点,之前一直没空关注的开发文件压缩打包问题也有时间来解决了 AMD模块化开发中的代码压缩打包工具——r.js 环境搭建基于nodejs:用于AMD模块化开发中的项目文件压缩打包,不是A ...

  5. r.js压缩打包

    AMD模块化开发中的代码压缩打包工具——r.js 环境搭建基于nodejs:用于AMD模块化开发中的项目文件压缩打包,不是AMD模式也是可以的 javascript部分 压缩javascript项目开 ...

  6. webpack配置:css文件打包、JS压缩打包和HTML文件发布

    一.CSS文件打包 1.在src下新建css文件,在css文件下新建index.css文件,输入以下代码 body{ color:red; font-size:20px; } 2.css建立好后,需要 ...

  7. Linux中常用压缩打包工具

    Linux中常用压缩打包工具 压缩打包是常用的功能,在linux中目前常用的压缩工具有gzip,bzip2以及后起之秀xz.本文将介绍如下的工具常见压缩.解压缩工具以及打包工具tar. gzip2 直 ...

  8. gulpfile.js 合并压缩 requirejs 的配置文件

    var gulp = require("gulp"); // var babel = require("gulp-babel"); // 用于ES6转化ES5 ...

  9. 前端打包构建工具grunt快速入门(大篇幅完整版)

    打包的目的和意义就不用叙述了直接上干货 http://www.gruntjs.net/getting-started里面的教程也太简单了,需要下一番功夫去研究才行.本文将grunt打包的常用方法都用实 ...

随机推荐

  1. Newtonsoft.Json 将C#对象转化为json格式

    object To json public static string ObjectToJson(object obj) { JsonSerializerSettings jss = new Json ...

  2. 领域模型(Domain Model)

    领域模型(Domain Model) 一:面向对象设计中最简单的部分与最难的部分 如果说事务脚本是 面向过程 的,那么领域模型就是 面向对象 的.面向对象的一个很重要的点就是:“把事情交给最适合的类去 ...

  3. Object.prototype.propertyIsEnumerable

    语法: obj.propertyIsEnumerable(prop); 此方法返回一个布尔值,表明指定的属性名是否是当前对象可枚举的自身属性. 1.如果是用户自定义了对象的属性,将返回true,比如 ...

  4. [转]ANDROID 探究oom内幕

    从早期G1的192MB RAM开始,到现在动辄1G -2G RAM的设备,为单个App分配的内存从16MB到48MB甚至更多,但OOM从不曾离我们远去.这是因为大部分App中图片内容占据了50%甚至7 ...

  5. SHELL 近期学习

    由于项目中很少使用到shell脚本所以.只是偶尔自学一点.慢慢积累.下面就把近段时间积累的发出来.学习. #sort sort 按首字母排序 sort -n 按数字大小 从小到大排序 sort -rn ...

  6. ASP.NET MVC应用程序更新相关数据

    为ASP.NET MVC应用程序更新相关数据 这是微软官方教程Getting Started with Entity Framework 6 Code First using MVC 5 系列的翻译, ...

  7. 飘逸的python - 命令行漂亮的显示json数据

    之前做的一个脚本把信息用json格式存到文本中.这样的好处是简便,易编辑,并且拥有强大的表达能力. 不过从文本cat出来的是一堆很难看的字符串,没换行和缩进.这时候就在想,如果有个类似于IDE的格式化 ...

  8. Jquery中获取iframe的代码方法

    父窗口中操作iframe:window.frames["iframeChild"].document //假如iframe的id为iframeChild 在子窗口中操作父窗口:wi ...

  9. Apache + Tomcat +mod_jk 实现集群

    实现效果:用apache 分发请求到tomcat中的对应的项目 环境说明: 操作系统:window7 Javasdk: 1.7 Apache: 2.2.14    (本地安装路径:D:\Apache2 ...

  10. vijos1004 博弈论

    一道挺简单的博弈论题 感觉自己也没有很规范的学过博弈论吧,就是偶尔刷到博弈论的题目,感受一下推导的过程,大概能领悟些什么 我们设2001.11.4必败,推上去,即2001.10.4和2001.11.3 ...