我的grunt配置
module.exports = function(grunt) { // 配置.
grunt.initConfig({
pkg: grunt.file.readJSON('package.json'),
watch: {
css: {
files: 'static/introduce/scss/**/*.scss',
tasks: ['clean:css','compass'],
options: {
livereload: true
}
} ,
includereplace:{
files:'src/html/**/*.html',
tasks:['includereplace','copy:html','clean:html']
} },
jshint:{//js代码检测工具
options: {
jshintrc: '.jshintrc'
},
src: ["src/static/introduce/js/app/**/*.js"]
},
includereplace: {//包含html片段
nav: {
files: [
{src: 'src/html/**/*.html', dest: '.tmphtml/'}
]
}
},
uglify: {//js压缩
options: {
banner: '/*! <%= pkg.name %> <%= grunt.template.today("yyyy-mm-dd") %> */\n'
},
js: {
files: [{
expand: true,
cwd: 'static/introduce/js',
src: '**/*.js',
dest: 'static/introduce/js',
ext:".min.js"
}]
}
},
compass: {//compass
dev: {
options: {
sassDir: 'static/introduce/scss',
cssDir: 'static/introduce/css',
outputStyle:'compressed',
noLineComments: true
}
}
},
clean: {//清除
mod:["static/introduce/css/module"],
css:["static/introduce/css"],
html:[".tmphtml/"]
},
copy: {//复制
css: {
expand: true,
cwd: 'static/introduce/css/',
src: '**',
dest: '../../src/SVipSys/SVipSys.Web/static/Introduce/css',
flatten: true,
filter: 'isFile'
},
scss:{
expand: true,
cwd: 'static/introduce/scss/',
src: '**',
dest: '../../src/SVipSys/SVipSys.Web/static/Introduce/scss'
},
html:{
expand: true,
cwd: '.tmphtml/src/html/',
src: '**',
dest: 'view/'
}
},
imagemin:{//图片压缩
dynamic: {
files: [{
expand: true,
cwd: 'static/',
src: ['**/*.{png,jpg,gif}'],
dest: 'static/'
}]
}
}
}); // 加载任务
grunt.loadNpmTasks('grunt-contrib-uglify');
grunt.loadNpmTasks('grunt-contrib-compass');
grunt.loadNpmTasks('grunt-contrib-clean');
grunt.loadNpmTasks('grunt-contrib-watch');
grunt.loadNpmTasks('grunt-contrib-copy');
grunt.loadNpmTasks('grunt-include-replace');
grunt.loadNpmTasks('grunt-contrib-jshint');
grunt.loadNpmTasks('grunt-contrib-imagemin'); // 任务列表
grunt.registerTask('default',['clean:css','compass','clean:mod',,'watch']);
grunt.registerTask('tpl',['includereplace','copy:html','clean:html']); };
写在后面的话,最初听到grunt这个词的时候,是在去年上半年,当时前端构建工具非常火,我一直觉得它是一个非常高大上的东西,后来发现真的只是个工具而已。大神们说,你们不应该被工具所累,因为工具是学不完的。是的,我们不需要跟风,但不代表不必要用。很多是项目需求,比如你在入职后接手了一些新的项目,那么,最好就是学习它,掌握它。使用grunt的时候,确实感到了方便之处,比如图片压缩、js压缩、代码检测。。。工具,它是帮我们干活,减少重复、无聊的工作量的。所以,使用它的时候,我们应该明确的知道,希望它能帮我们干什么活,而不是对着API写一堆配置都不知道在干嘛。。。
我的grunt配置的更多相关文章
- grunt配置任务
这个指南解释了如何使用 Gruntfile 来为你的项目配置task.如果你还不知道 Gruntfile 是什么,请先阅读 快速入门 指南并看看这个Gruntfile 实例. Grunt配置 Grun ...
- Nodejs+Grunt配置SASS项目自动编译
Nodejs+Grunt配置SASS项目自动编译 早前听说Nodejs和Grunt很强大,特别是用来构建自动化的前端开发,更是强大无比.但一直碍于自己掌握的技术有限,不敢深入,也未曾深入下去.最近在开 ...
- grunt配置详情
这个grunt配置 是我的一个程序员朋友从网上无意间看到的,然后他亲测了下,恩,是可以的.不过我到目前还未测试过是否可以. 一.安装node, 首先确保电脑已有node的环境.然后 运行 npm i ...
- grunt配置太复杂?发布一个前端构建工具,简单高效,自动跳过未更新的文件
做前端项目,如果没有一个自动化构建工具,手动处理那简直就是坑爹O(∩_∩)O.于是上网了解了下,grunt用的人不少,功能也挺强大.看了一下grunt的配置(包括gulp),感觉稍显复杂.当时项目结构 ...
- grunt配置太复杂?使用Qbuild进行文件合并、压缩、格式化等处理
上次简单介绍了下Qbuild的特点和配置,其实实现一个自动化工具并不复杂,往简单里说,无非就是筛选文件和处理文件.但Qbuild的源码也并不少,还是做了不少工作的. 1. 引入了插件机制.在Qbuil ...
- grunt配置sass项目自动编译
1.安装Ruby和SASS 首先我们需要在电脑上安装Ruby和SASS.如果您使用的是Mac,您就没必要安装Ruby.如果您使用的是Window系统,你需要安装Ruby. 2.安装Nodejs 由于使 ...
- 配置grunt进行css、js的检查、合并和压缩
现在会进行代码的合并和压缩已成为前端人员的必备知识,那么现在来介绍一个grunt的工具.grunt是个风靡世界的工具,它的首页是 http://www.gruntjs.net 这是个中文网站,有文档 ...
- grunt安装、配置、在webstrom中使用
1.全局范围安装 Grunt命令行(CLI) npm install -g grunt-cli Grunt CLI的任务很简单:调用与Gruntfile在同一目录中 Grunt.这样带来的好处是,允许 ...
- grunt项目配置
安装完CLI,还要在项目安装Grunt npm install -g grunt-cli npm install grunt --save-dev 源码放在src下 package.json放在根目录 ...
随机推荐
- js跨域请求方式 ---- JSONP原理解析
这篇文章主要介绍了js跨域请求的5中解决方式的相关资料,需要的朋友可以参考下 跨域请求数据解决方案主要有如下解决方法: 1 2 3 4 5 JSONP方式 表单POST方式 服务器代理 H ...
- Nuget-QRCode:jquery-qrcode
ylbtech-Nuget-QRCode:jquery-qrcode 1.返回顶部 1. <!DOCTYPE html> <html> <head> <tit ...
- saltstack syndic安装配置使用
salt-syndic是做神马的呢?如果大家知道zabbix proxy的话那就可以很容易理解了,syndic的意思为理事,其实如果叫salt-proxy的话那就更好理解了,它就是一层代理,如同zab ...
- openstack开发环境搭建
1 目的 让linux下的openstack代码能在windows上面实现同步开发. 2 目标 使用samba实现window与Linux的文件共享. 3 实验环境 ...
- 0003_Linux基础之常用命令
1.pwd:查看当前所在目录 2.cd :切换目录 3.ls:查看当前目录下的文件及文件夹: 4.ls -l :列出当前目录下文件及详细信息 drwxr-xr-x 第一个字符为d则 ...
- Key and Certificate Conversion
Key and Certificate Conversion Private keys and certificates can be stored in a variety of formats, ...
- Spring入门第十六课
接上一次讲课 先看代码: package logan.spring.study.annotation.repository; public interface UserRepository { voi ...
- oracle知识点小结1
总结一下这几天学习oracle的琐碎知识点. 创建表空间,用户的步骤: 1, sql / as sysdba登陆 2, 创建临时表空间 abc_tmp 3, 创建用户表空间(或称数据表空间) abc_ ...
- python 学习笔记8 (模块)
Python 模块(Module),是一个 Python 文件,以 .py 结尾,包含了 Python 对象定义和Python语句. 模块让你能够有逻辑地组织你的 Python 代码段. 把相关的代码 ...
- 从网络架构方面简析循环神经网络RNN
一.前言 1.1 诞生原因 在普通的前馈神经网络(如多层感知机MLP,卷积神经网络CNN)中,每次的输入都是独立的,即网络的输出依赖且仅依赖于当前输入,与过去一段时间内网络的输出无关.但是在现实生活中 ...