html5e插件,WebStorm学习笔记002---grunt-watch插件的使用-修改html,css,js文件实现自动编译更新...

配置css和js文件发生变化就重新合并压缩css和js文件

package.json

{

"name": "AngularAndRequire",

"version": "0.1.0",

"description" : "AngularAndRequire1.0",

"author": "Mario.Li",

"devDependencies": {

"grunt": "~0.4.1",

"grunt-contrib-jshint": "~0.6.3",

"grunt-contrib-uglify": "~0.2.1",

"grunt-contrib-concat": "~0.1.1",

"grunt-contrib-watch": "~0.6.1",

"grunt-css": "~0.5.4"

}

}

Gruntfile.js

'use strict'

module.exports = function(grunt) {

// 配置

grunt.initConfig({

pkg : grunt.file.readJSON('package.json'),

concat : {

libs : {

src: ['frontend/libs/*.js', '!frontend/libs/require.js'],

dest: 'dest/libs.js'

},

custs: {

src: ['frontend/**/*.js', '!frontend/libs/*.js'],

dest: 'dest/cust.js'

},

css : {

src : ['frontend/styles/*.css', '!frontend/styles/index.css'],

dest : 'dest/index.css'

}

},

uglify : {

options : {

banner : '/*! */\n'

},

buildlibs : {

src : 'dest/libs.js',

dest : 'dest/libs.min.js'

},

buildcusts : {

src : 'dest/cust.js',

dest : 'dest/cust.min.js'

},

},

cssmin : {

buildCss : {

src : 'dest/index.css',

dest : 'dest/index.min.css'

}

},

watch : {

all : {

files :['**/*.js', '**/*.css'],

tasks : ['concat', 'uglify', 'cssmin']

}

}

});

// 载入concat和uglify插件,分别对于合并和压缩

grunt.loadNpmTasks('grunt-contrib-watch');

grunt.loadNpmTasks('grunt-css');

grunt.loadNpmTasks('grunt-contrib-concat');

grunt.loadNpmTasks('grunt-contrib-uglify');

// 注册任务

grunt.registerTask('default', ['concat', 'uglify', 'cssmin', 'watch']);

};

参考资料:http://blog.csdn.net/itpinpai/article/details/48207493

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值